Method To Remove Duplicates In Array Javascript

Method To Remove Duplicates In Array Javascript

5 min read Jun 20, 2024
Method To Remove Duplicates In Array Javascript

Methods to Remove Duplicates in an Array in JavaScript

Removing duplicates from an array is a common task in JavaScript programming. There are several methods to achieve this, each with its own advantages and disadvantages. Here are some of the most popular methods:

1. Using a Set

Sets in JavaScript are collections of unique values. We can leverage this property to eliminate duplicates from an array.

Code:

function removeDuplicatesSet(arr) {
  return [...new Set(arr)];
}

const myArray = [1, 2, 2, 3, 4, 4, 5];
const uniqueArray = removeDuplicatesSet(myArray);
console.log(uniqueArray); // Output: [1, 2, 3, 4, 5]

Explanation:

  1. We create a new Set from the input array. Sets automatically discard duplicate values.
  2. We use the spread syntax (...) to convert the Set back into an array.

This method is efficient and concise, making it a popular choice.

2. Using filter and indexOf

The filter method allows us to create a new array containing only elements that pass a specific condition. We can use indexOf to check if an element has already been added to the new array.

Code:

function removeDuplicatesFilter(arr) {
  return arr.filter((item, index) => arr.indexOf(item) === index);
}

const myArray = [1, 2, 2, 3, 4, 4, 5];
const uniqueArray = removeDuplicatesFilter(myArray);
console.log(uniqueArray); // Output: [1, 2, 3, 4, 5]

Explanation:

  1. We iterate through the array using filter.
  2. For each element, we check if its index in the original array matches its first occurrence using indexOf.
  3. If the indexes match, it means the element is unique, and we keep it in the new array.

This method is less efficient than using a Set but provides more control over the filtering process.

3. Using a for loop and an object

We can also use a for loop and an object to track unique elements.

Code:

function removeDuplicatesLoop(arr) {
  const uniqueElements = {};
  const uniqueArray = [];

  for (let i = 0; i < arr.length; i++) {
    if (!uniqueElements[arr[i]]) {
      uniqueElements[arr[i]] = true;
      uniqueArray.push(arr[i]);
    }
  }

  return uniqueArray;
}

const myArray = [1, 2, 2, 3, 4, 4, 5];
const uniqueArray = removeDuplicatesLoop(myArray);
console.log(uniqueArray); // Output: [1, 2, 3, 4, 5]

Explanation:

  1. We create an empty object uniqueElements to track unique elements.
  2. We iterate through the array using a for loop.
  3. For each element, we check if it exists as a key in uniqueElements.
  4. If it doesn't exist, we add it to uniqueElements and push it to uniqueArray.

This method provides more flexibility but can be less efficient than the other methods.

Conclusion

Choosing the right method depends on the specific situation and the performance requirements. Using a Set is generally the most efficient and concise approach. However, the filter and for loop methods offer more flexibility and can be useful in certain scenarios.