JavaScript: Get Unique values from Array

Best Solution: Using a Set

let array = [1, 2, 3, 2, 3, 4, 5, 5, 6];
let uniqueArray = [...new Set(array)];
console.log(uniqueArray); // Outputs: [1, 2, 3, 4, 5, 6]

In this code snippet, new Set(array) creates a new Set object from our array, automatically removing any duplicates. The spread operator (...) then converts this Set object back into an array.

Remember that the Set object does not guarantee to maintain the original order of elements. If you need to preserve the order, you might want to use the filter() method instead.

Using Array.filter()

This method is best used to preserve the order of the original array.

let array = [1, 2, 3, 2, 3, 4, 5, 5, 6];
let uniqueArray = array.filter((value, index, self) => {
  return self.indexOf(value) === index;
});
console.log(uniqueArray); // Outputs: [1, 2, 3, 4, 5, 6]

In this example, array.filter() creates a new array with all elements that pass the test implemented by the provided function. In our case, the test is whether the first occurrence of a value is equal to the current index.

Using Array.reduce()

The reduce() method applies a function against an accumulator and each element in the array (from left to right) to reduce it to a single output value. In this case, we’re using it to accumulate our unique values into a new array.

let array = [1, 2, 3, 2, 3, 4, 5, 5, 6];
let uniqueArray = array.reduce((unique, item) => {
  return unique.includes(item) ? unique : [...unique, item];
}, []);
console.log(uniqueArray); // Outputs: [1, 2, 3, 4, 5, 6]

In this snippet, for each item in our original array, reduce() checks if it already exists in our unique array. If it doesn’t, the item is added to unique. The result is a new array with no duplicate values.

Using Array.forEach()

The forEach() method executes a provided function once for each array element. Here, we’re using it to iterate over our array and add each item to our uniqueArray, but only if it doesn’t already exist there.

let array = [1, 2, 3, 2, 3, 4, 5, 5, 6];
let uniqueArray = [];
array.forEach((item) => {
  if (!uniqueArray.includes(item)) {
    uniqueArray.push(item);
  }
});
console.log(uniqueArray); // Outputs: [1, 2, 3, 4, 5, 6]

This method is straightforward and easy to understand, but it can be less efficient than some other methods when dealing with large arrays.

Using Array.Map()

The Map object holds key-value pairs and remembers the original insertion order of the keys. It doesn’t allow duplicate keys, making it useful for extracting unique values.

let array = [1, 2, 3, 2, 3, 4, 5, 5, 6];
let uniqueArray = [...new Map(array.map(item => [item, item])).values()];
console.log(uniqueArray); // Outputs: [1, 2, 3, 4, 5, 6]

In this example, we’re creating a new Map object where each key-value pair is an array [item, item]. Then, we extract the values from our Map object (which are guaranteed to be unique) and spread them into a new array.

Remember to choose the method that best suits your needs based on factors like performance, readability, and compatibility with older JavaScript versions.