Remove Duplicate Elements from TypeScript Array

TypeScript array is a single variable that is used to store the elements or a group of values of the same type. An array can contain multiple occurrences or duplicates of an element that can be removed using the below-discussed methods.

Below are the approaches used to remove Duplicate Elements from the TypeScript Array

Approach 1: Using TypeScript filter() Method

The filter() method creates a new array of elements that matches the passed condition through the callback function. It will include only those elements for which true is returned.

Example: The below code uses the filter() method to remove duplicate of an element in TypeScript array.

let arr = [1, 2, 2, 3, 4, 3, 5, 4, 6, 5];
 
const removeDups = (arr: number[]): number[] => {
    return arr.filter((item,
        index) => arr.indexOf(item) === index);
}
console.log(removeDups(arr));

Output:

[ 1, 2, 3, 4, 5, 6]

Approach 2: Using TypeScript reduce() Method

The reduce() method is used to reduce the elements of the array and combine them into a final array based on some reducer function that you pass.

Example: The reduce() method is used to remove duplicates from an array in TypeScript.

let arr = [1, 2, 2, 3, 4, 3, 5, 4, 6, 5];

const removeDups = ( arr: number[]): number[]  => {
    let unique: number[] = 
        arr.reduce(function (acc: number[], curr: number) {
        if (!acc.includes(curr))
            acc.push(curr);
        return acc;
    }, []);
    return unique;
}

console.log(removeDups(arr));

Output:

[ 1, 2, 3, 4, 5, 6]

Approach 3: Using TypeScript set() Method

This method sets a new object type that allows you to create collections of unique values.

Example: This example uses the TypeScript set() method to remove duplicates from an array.

let arr = [1, 2, 2, 3, 4, 3, 5, 4, 6, 5];

const removeDups = (arr: number[]): number[] => {
    return [...new Set(arr)];
}
 
console.log(removeDups(arr));

Output:

[ 1, 2, 3, 4, 5, 6]

Approach 4: Using TypeScript indexOf() Method

The indexOf() method is used to find the first index of occurrence of an array element. we can iterate over the elements in the array, and we will push into the new array if it doesn’t exist in the resultant array.

Example: The below code example uses the indexOf() method method to remove duplicates from an array in TypeScript.

let arr = [1, 2, 2, 3, 4, 3, 5, 4, 6, 5];

const removeDups = (arr: number[]) : number[] => {
    let unique: number[] = [];
    for (let i = 0; i < arr.length; i++) {
        if (unique.indexOf(arr[i]) === -1) {
            unique.push(arr[i]);
        }
    }
    return unique;
}
console.log(removeDups(arr));

Output:

[ 1, 2, 3, 4, 5, 6]

Approach 5: Using TypeScript forEach() Method

By using the forEach() method, we can iterate over the elements in the array, and we will push into the new array if it doesn’t exist in the array.

Example: The forEach() method is used to remove the elements from the TypeScript array in the below code.

let arr = [1, 2, 2, 3, 4, 3, 5, 4, 6, 5];

const removeDups = (arr: number[]) : number[] => {
    let unique: number[] = [];
    arr.forEach(element => {
        if (!unique.includes(element)) {
            unique.push(element);
        }
    });
    return unique;
}
console.log(removeDups(arr));

Output:

[ 1, 2, 3, 4, 5, 6]

Approach 6: Using TypeScript Map

The Map object holds key-value pairs and remembers the original insertion order of the keys. We can leverage this feature to remove duplicates from an array.

Example: In the following example, we utilize a Map to remove duplicate elements from a TypeScript array.

let arr = [1, 2, 2, 3, 4, 3, 5, 4, 6, 5];

const removeDups = (arr: number[]): number[] => {
    const map = new Map<number, boolean>();
    const unique: number[] = [];

    arr.forEach(item => {
        if (!map.has(item)) {
            map.set(item, true);
            unique.push(item);
        }
    });

    return unique;
}

console.log(removeDups(arr));

Output:

[1, 2, 3, 4, 5, 6]

Approach 7: Using TypeScript Sort() and Reduce() Methods Together

Another approach to remove duplicates from an array in TypeScript involves first sorting the array and then using the reduce() method to filter out the duplicates. This method can be efficient, especially for large arrays, as it reduces the complexity by ensuring only adjacent elements need to be compared.

Example: The below code uses the sort() and reduce() methods together to remove duplicates from a TypeScript array.

let array: number[] = [5, 3, 2, 1, 4, 5, 3, 6, 2];

array.sort((a, b) => a - b);

let uniqueArray = array.reduce((acc: number[], currentValue: number) => {
    if (acc.length === 0 || acc[acc.length - 1] !== currentValue) {
        acc.push(currentValue);
    }
    return acc;
}, []);

console.log(uniqueArray);

Output:

[ 1, 2, 3, 4, 5, 6 ]