Remove Duplicate Elements from JavaScript Array

Last Updated : 09 Jan, 2025

To Remove the elements from an array we can use the JavaScript set method. Removing duplicate elements requires checking if the element is present more than one time in the array.

1. Using JavaScript Set() - Mostly Used

The JavaScript Set() method creates an object containing only unique values. To remove the duplicate elements we can use the set and then convert the object back to array to get the only unique values.

JavaScript

let a = [ 10, 20, 20, 30, 40, 50, 50 ];

// Create set of unique values using Set constructor
let s = new Set(a);

let a1 = [...s]

console.log(a1);

Output

[ 10, 20, 30, 40, 50 ]

The duplicate elements are removed as shown below:

remove-duplicate-array-from-javascript

2. Using JavaScript filter() Method with indexOf method

The array.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.

To check the repeated elements we will use the array.idexOf method. If it returns same index then push the elements else skip the element and return the updated array.

JavaScript

let a = [10, 20, 20, 30, 40, 50, 50];

// Using filter with indexOf to find the repeated elements
a1 = a.filter((item, index) => a.indexOf(item) === index);

console.log(a1);

Output

[ 10, 20, 30, 40, 50 ]

Mastering such array operations is key to writing efficient JavaScript.

3. Using JavaScript forEach() with array.includes() 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. To check the element in the new array we will use the array.includes() method, it returns -1 if the element is not present.

JavaScript

let a = [10, 20, 20, 30, 40, 50, 50];
let a1 = [];
a.forEach(element => {
    if (!a1.includes(element)) {
        a1.push(element);
    }
});

console.log(a1);

Output

[ 10, 20, 30, 40, 50 ]

4. Using JavaScript reduce() with array.includes() 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. To check the element in the accumulator array we will use the array.includes() method, it returns -1 if the element is not present.

JavaScript

let a = [10, 20, 20, 30, 40, 50, 50];
let a1 = a.reduce(function (acc, curr) {
    if (!acc.includes(curr)) {
        acc.push(curr);
    }
    
    return acc;
}, []);

console.log(a1)

Output

[ 10, 20, 30, 40, 50 ]

Using third-party Library

We can also use a third-party library such as Lodash or Underscore.js to remove duplicate elements from a Javascript array. The _.uniq() function returns the array which does not contain duplicate elements.

HTML

<!DOCTYPE html>
<html>

<head>
    <script src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js">
    </script>
</head>

<body>
    <script type="text/javascript">
        console.log(_.uniq([1, 2, 3, 4, 5, 4, 3, 2, 1]));
    </script>
</body>

</html>