Everyone has to remove duplicates from an array in JavaScript at some point. It’s even a common coding challenge asked during interviews.
How to Remove Duplicates From a JavaScript Array
To remove duplicate elements from a JavaScript array using the Set() method, type:
var arr = [1, 2, 3, 4, 2, 2];
function removeDuplicates(arr) {
return [...new Set(arr)];
}
console.log(removeDuplicates(arr));The output of this sample code becomes: [1, 2, 3, 4]
With that in mind, here are some different ways to filter out duplicates from an array and return only the unique values.
How to Remove Duplicates From JavaScript Arrays: 7 Methods to Know
There are several ways to remove duplicates from a JavaScript array and clean up your code. Below are seven methods for eliminating repeated data from your JavaScript arrays.
1. Filter Method
The filter method creates a new array of elements that pass the conditional we provide. And any element that fails or returns false, it won’t be in the filtered array.
We can also use the filter method to retrieve the duplicate values from the array by simply adjusting our condition.
2. Sets
Sets are a new object type with ES6 (ES2015) that allows you to create collections of unique values.
3. forEach Method
By using forEach, we can iterate over the elements in the array, and we will push into the new array if it doesn’t exist in the array.
4. Reduce Method
Reduce is always a bit trickier to understand. The reduce method is used to reduce the elements of the array and combine them into a final array based on the reducer function that you pass.
Here is the same reduce method with a different approach:
5. Adding a Unique Method to the Array Prototype
In JavaScript, the array prototype constructor allows you to add new properties and methods to the Array object.
Sets will work much faster when you compare with the normal approach.
6. Underscore JS
_.uniq method produces a duplicate-free version of the array. We can also sort this array by passing the second parameter as true.
7. Removing Duplicate Objects Using the Property Name
Sometimes you have to remove duplicate objects from an array of objects by the property name. We can achieve this by:
Frequently Asked Questions
How to find duplicates in JavaScript array?
Duplicate elements can be found in a JavaScript array using various methods, including:
- filter()
- Set()
- indexOf()
- Using an object to track elements
- Using a nested for-in loop to iterate through elements and compare them
How to remove duplicates in a JavaScript array?
Duplicate elements in JavaScript arrays can be removed by methods like:
- filter()
- Set()
- indexOf()
- forEach()
- reduce()
- _.uniq()
