DEV Community

Cover image for How to remove duplicates from JavaScript array

How to remove duplicates from JavaScript array

Kristijan Pajtasev on February 02, 2021

Recently, I posted a small snippet on how to remove duplicates from an array using a filter function. That started a thread on all the different wa...
Read full post
Collapse
 
chrismilson profile image
Chris Milson •

You could sort the array first and then all duplicates will be next to each other:

const numbers = [1, 2, 3, 1, 2, 3, 1, 2, 3];

const unique = [...numbers].sort().filter((v, i, arr) => i === 0 || arr[i - 1] !== v)

console.log(unique) // [1, 2, 3]
Enter fullscreen mode Exit fullscreen mode
Collapse
 
ibnsamy96 profile image
Mahmoud Ibn Samy •

why did you use an instance of the numbers array, not the number array itself? " [...numbers].sort() not numbers.sort() "

Collapse
 
hi_iam_chris profile image
Kristijan Pajtasev •

That is a good question, sort is a destructive function. This means running sort on numbers array will change original numbers array.

Thread Thread
 
ibnsamy96 profile image
Mahmoud Ibn Samy •

wow I forgot that

Collapse
 
ibnsamy96 profile image
Mahmoud Ibn Samy •

Great ways but is it efficient to use the sets method? Especially in the big arrays.

Collapse
 
andrewbridge profile image
Andrew Bridge •

I'd imagine if you were using a Set from the start, and adding values via the .add method on the Set object, you wouldn't need to store or iterate through the all the duplicates. That won't help if you needed to retain all the dupe data for some other uses though.

Collapse
 
ibnsamy96 profile image
Mahmoud Ibn Samy •

I agree that in some use cases you can't use Set. Actually, in some cases, you can't even use it from the beginning, As an example, if you want to have a collection of unique objects, Set won't help.

Collapse
 
hi_iam_chris profile image
Kristijan Pajtasev •

There is a topic on the StackOverflow showing the set is faster. I do personally like filter more, but in most cases, you won't see the difference, and you can go for what looks best in your code.

Collapse
 
ibnsamy96 profile image
Mahmoud Ibn Samy •

That's good. Thanks.

Collapse
 
dansvel profile image
dan •

and,, you can create a funtion for it,,

const unique = arr => [...new Set(arr)];

console.log(unique(numbers))
Enter fullscreen mode Exit fullscreen mode
Collapse
 
hi_iam_chris profile image
Kristijan Pajtasev •

Ah yes, spread operator, love that one :smilery: