Remove duplicate elements from array in JavaScript

By Atul Rai | Last Updated: July 30, 2024 Previous

You have the below array of objects and must remove all duplicate elements based on some conditions and return the final data in the same format.

let employees = [
    { name: "Ram", age: 27, salary: 1000 },
    { name: "Shyam", age: 30, salary: 2000 },
    { name: "Ram", age: 27, salary: 3000 },
    { name: "Ram", age: 25, salary: 4000 },
    { name: "Ghanshyam", age: 21, salary: 5000 }
];

1. Remove the duplicate based on the ‘name’ property

let employees = [
  { name: 'Ram', age: 27, salary: 1000 },
  { name: 'Shyam', age: 30, salary: 2000 },
  { name: 'Ram', age: 27, salary: 3000 },
  { name: 'Ram', age: 25, salary: 4000 },
  { name: 'Ghanshyam', age: 21, salary: 5000 },
];

let uniqueEmp = [...new Map(employees.map(item => [item.name, item])).values()];

console.log(uniqueEmp);

Output:

[
  { name: 'Ram', age: 25, salary: 4000 },
  { name: 'Shyam', age: 30, salary: 2000 },
  { name: 'Ghanshyam', age: 21, salary: 5000 }
]

Explanation:

1. Use map to transform the array of objects into an array of key-value pairs (tuples), with name as the key and the object as the value.
2. Create a Map from these key-value pairs. This will automatically remove duplicates based on the name property, as Map keys must be unique.
3. Use values to get the unique objects from the Map, and spread these into a new array.

1.1 Using Set and filter

let seenNames = new Set();
let uniqueEmployees = employees.filter(employee => {
    if (seenNames.has(employee.name)) {
        return false;
    } else {
        seenNames.add(employee.name);
        return true;
    }
});

console.log(uniqueEmployees);

The above code uses a Set called seenNames to keep track of the names that have been encountered. The filter method iterates through the employees array, and for each employee, it checks if the name has already been seen. If not, it adds the name to the Set and includes the employee in the uniqueEmployees array.

2. Remove the duplicate based on the ‘name’ & ‘age’ property

let uniqueEmployees = employees.filter((employee, index, self) =>
    index === self.findIndex((e) => (
        e.name === employee.name && e.age === employee.age
    ))
);

console.log(uniqueEmployees);

This code uses filter to iterate over the employees array and findIndex to find the first occurrence of an object with the same name and age. If the current index matches the first occurrence’s index, the element is included in the uniqueEmployees array.

Output:

[
  { name: 'Ram', age: 27, salary: 1000 },
  { name: 'Shyam', age: 30, salary: 2000 },
  { name: 'Ram', age: 25, salary: 4000 },
  { name: 'Ghanshyam', age: 21, salary: 5000 }
]

References

1. How to Create and Save text file in JavaScript
2. JavaScript form validation example