Discussion on: Removing duplicates in an Array of Objects in JS with Sets

View post

Here's another possibility using the Map class constructor and values method:

const arr = [
  { id: 1, name: "test1" },
  { id: 2, name: "test2" },
  { id: 2, name: "test3" },
  { id: 3, name: "test4" },
  { id: 4, name: "test5" },
  { id: 5, name: "test6" },
  { id: 5, name: "test7" },
  { id: 6, name: "test8" }
];

const uniqueObjects = [...new Map(arr.map(item => [item.id, item])).values()]

Sam Clark • Jul 20 '20

wow, i love that

marlon zayro arias v • May 8 '20

Thanks !!

Mayank Soni • Jul 17 '21

Hi Tony. Your answer helped me, thanks!
BTW, can you please help me achieve this array?
[
{ id: 1, name: "test1" },
{ id: 2, name: "test2" },
{ id: 2, name: "test3" },
{ id: 3, name: "test2" }
]

I mean even if 'id' or 'name' already exists, it should not be omitted because either of the value is different (like in the case of 'name: "test2"') in the whole array.

Tony Childs • Jul 17 '21

Hi Mayank,

I'm not sure I follow. If no duplicates are removed then that is just the original array is it not? Or do you mean you want an array with just ids 1, 2, and 3? If so, you can use Array.prototype.filter and only return true for the ids you want to keep.

Corfitz • Mar 29 '22

Hey @mayanxoni ,

Might be late with a reply here, but in your case I would probably map through your array of objects as stringified content, as you are not relying on a single identifier but an entire object.

NB: Though this might not be performant when you are dealing with bigger objects and large arrays.

const arr = [
{ id: 1, name: "test1" },
{ id: 2, name: "test2" },
{ id: 2, name: "test2" },
{ id: 2, name: "test2" },
{ id: 2, name: "test3" },
{ id: 3, name: "test2" }
];

const newArray = Array.from(new Set(arr.map(el => JSON.stringify(el)))).map(el => JSON.parse(el));

brian • Mar 23 '21

Great

alanwong9179 • Jan 6 '21

I have to create an account and say thank you! This answer save my day.

Corfitz • Mar 29 '22 • Edited

There is a difference between Tony's and Matt's approach in how the final array will look like.

Matt's approach is adding the id for each entry it loops through to a Set and checks whether or not it has been ´seen´ before or not, and return the object if 'no' is the case. So if we look at the returned object with ID: 2, Matt will return the object with name: "test2" as it will consider the next object a duplicate and skip it.

Tony's approach is by creating a new map using ID as a key - which has to be unique - and then extracts the values. E.g. [1: { id: 1, name: "test1" }, 2: { id: 2, name: "test2" }....] etc. What this means though, is that even though id: 2 has been added to the map, it is simply overwritten by the third item in the array, thus Tony will return name: "test3" for ID: 2.

Just keep this in mind whether you want the first object or the last object by a duplicated identifier to be the truth.