How to Remove Duplicates from an Array of Objects using TypeScript ?

We are given an array of objects and we have to check if there are duplicate objects present in the array and remove the duplicate occurrences from it. Otherwise, return the array as it is.

Examples of Removing Duplicates from an Array of Objects using TypeScript

1.Using filter() and findIndex() methods

This approach involves using the filter() function along with the findIndex() method to create a new array containing only the unique objects.

Syntax:

const uniqueArray = originalArray.
    filter((obj, index, self) =>index === 
    self.findIndex((o) => o.propertyToCheck === obj.propertyToCheck)
);

Example: The below code uses filter() and the findIndex() method to remove duplicate objects from an array.

interface Person {
    id: number;
    name: string;
}

const persons: Person[] = [
    { id: 1, name: 'Ram' },
    { id: 2, name: 'Shyam' },
    { id: 1, name: 'Ram' },
    { id: 3, name: 'Sita' },
];

const uniquePersons = persons.
    filter((person, index, self) => index ===
        self.findIndex((p) => p.id === person.id)
    );

console.log(uniquePersons);

Output:

[
    {   "id": 1,   "name": "Ram" }, 
    {   "id": 2,   "name": "Shyam" }, 
    {   "id": 3,   "name": "Sita" }
]

2.Using Set and Array.from() method

This approach utilizes a Set to keep track of unique values based on the selected property. The Array.from() method is used to convert the created Set into a array.

Syntax:

const uniqueArray = Array.from(new Set
    (originalArray.map((obj) => obj.propertyToCheck)));

Example: The below code explains the use of the Set and the Array.from() method to remove duplicate objects.

interface Person {
    id: number;
    name: string;
}

const persons: Person[] = [
    { id: 1, name: 'Ram' },
    { id: 2, name: 'Shyam' },
    { id: 1, name: 'Ram' },
    { id: 3, name: 'Sita' },
];

// Adding values of id key of each object to set
const mySet = new Set(persons.map((person) => person.id));

// Converting Set to a array using Array.from() method
const uniqueIds = Array.from(mySet);

console.log(uniqueIds);

Output:

[1, 2, 3]

3.Using reduce() method

This approach uses the reduce() method to build a new array containing only the unique objects. For each object in the input array, it checks if the unique array already contains an object with the same key value. If not, it adds the object to the unique array.

Example: The below code explains the use of reduce() method to remove duplicate objects.

function removeDuplicates(
    arr: any[],
    key: string
): any[] {
    return arr.reduce((unique, item) => {
        // Check if the current object has the specified key
        if (item.hasOwnProperty(key)) {
            // Check if there is no existing object with the same key value
            if (
                !unique.some(
                    (obj) =>
                        obj[key] === item[key]
                )
            ) {
                unique.push(item);
            }
        } else {
            // If the key doesn't exist in the current object, always include it in the unique array
            unique.push(item);
        }
        return unique;
    }, []);
}

let arrayOfObjects = [
    { id: 1, name: "amit" },
    { id: 2, name: "saurabh" },
    { id: 1, name: "amit" },
    { id: 3, name: "soham" },
    { id: 2, name: "saurabh" },
];

let uniqueArray = removeDuplicates(
    arrayOfObjects,
    "id"
);
console.log(uniqueArray);

Output

[
  { id: 1, name: 'amit' },
  { id: 2, name: 'saurabh' },
  { id: 3, name: 'soham' }
]

4. Using an Object to Track Unique Objects

This approach involves using an object to keep track of unique objects based on a specific property. It iterates through the array of objects, and for each object, it checks whether the property value already exists in the object. If it does not exist, it adds the object to the result array and adds the property value to the tracking object. This approach ensures that only unique objects are included in the result.

Syntax:

function removeDuplicates(arr: any[], key: string): any[] {
    return arr.reduce((unique, item) => {
        if (!unique.find(obj => obj[key] === item[key])) {
            unique.push(item);
        }
        return unique;
    }, []);
}

Example: The following code demonstrates the use of the removeDuplicates function to remove duplicate objects based on the id property from an array of objects.

function removeDuplicates(arr: any[], key: string): any[] {
    return arr.reduce((unique, item) => {
        if (!unique.find((obj : any) => obj[key] === item[key])) {
            unique.push(item);
        }
        return unique;
    }, []);
}

interface Person {
    id: number;
    name: string;
}

const arrayOfObjects: Person[] = [
    { id: 1, name: "nikunj" },
    { id: 2, name: "dhruv" },
    { id: 1, name: "nikunj" },
    { id: 3, name: "yash" },
    { id: 2, name: "dhruv" },
];

const uniqueArray = removeDuplicates(arrayOfObjects, "id");
console.log(uniqueArray);

Output:

[{
  "id": 1,
  "name": "nikunj"
}, {
  "id": 2,
  "name": "dhruv"
}, {
  "id": 3,
  "name": "yash"
}]