how to remove duplicate array object in javascript

How to Remove Duplicate Array Object in Javascript

If you are working with arrays in JavaScript, you may come across situations where you need to remove duplicate objects from the array. This can be done in several ways, and I will explain a few methods below.

Method 1:

The first method involves using the Set object. The Set object lets you store unique values of any type, including objects. By converting the array into a Set and then back into an array, we can remove duplicates.

let arr = [{id: 1, name: "John"}, {id: 2, name: "Jane"}, {id: 1, name: "John"}];
let uniqueArr = Array.from(new Set(arr.map(a => JSON.stringify(a)))).map(a => JSON.parse(a));
console.log(uniqueArr);
// Output: [{id: 1, name: "John"}, {id: 2, name: "Jane"}]

In the above code, we first use the map method to convert each object in the array into a string using JSON.stringify. This is because the Set object compares values using strict equality, which does not work for objects. We then convert the resulting Set object back into an array using Array.from and map each string back into an object using JSON.parse.

Method 2:

The second method involves using a loop to iterate over the array and remove duplicates. We can do this by comparing each object with all the following objects in the array and removing any duplicates we find.

let arr = [{id: 1, name: "John"}, {id: 2, name: "Jane"}, {id: 1, name: "John"}];
for (let i = 0; i < arr.length; i++) {
  for (let j = i + 1; j < arr.length; j++) {
    if (JSON.stringify(arr[i]) === JSON.stringify(arr[j])) {
      arr.splice(j, 1);
      j--;
    }
  }
}
console.log(arr);
// Output: [{id: 1, name: "John"}, {id: 2, name: "Jane"}]

In the above code, we use two nested loops to iterate over the array and compare each object with all the following objects. If we find a duplicate, we remove it using the splice method and decrement the inner loop counter so that we don't skip any objects.

Method 3:

The third method involves using the filter method to create a new array with only unique objects. We can do this by checking if the index of the current object is equal to the first index of that object in the array.

let arr = [{id: 1, name: "John"}, {id: 2, name: "Jane"}, {id: 1, name: "John"}];
let uniqueArr = arr.filter((obj, index) => {
  return index === arr.findIndex(o => {
    return JSON.stringify(o) === JSON.stringify(obj);
  });
});
console.log(uniqueArr);
// Output: [{id: 1, name: "John"}, {id: 2, name: "Jane"}]

In the above code, we use the filter method to create a new array with only unique objects. We do this by checking if the index of the current object is equal to the first index of that object in the array. We use the findIndex method to find the first index of each object, and we compare objects using JSON.stringify.

These are just a few of the methods you can use to remove duplicate objects from arrays in JavaScript. Choose the one that works best for your particular situation.