Skip to content

All topics  /  JavaScript

How to remove duplicate elements from JavaScript Array?

JavaScript ·

When “How to remove duplicate elements from JavaScript Array?” moves through design, development and browser testing, revenue per employee can clarify hand-offs and time spent on revisions while leaving code quality, accessibility and released behaviour as the real measures of success.

For API changes, browser support and current usage patterns, compare the snippet with MDN Web Docs before adopting it in production.

In this example, I will show you how to remove duplicate elements from javascript array. I explained simply step by step remove duplicates from array javascript. you can understand a concept of javascript - remove duplicate values from js array. it's simple example of remove duplicates from an array. you will do the following things for javascript - delete duplicate elements from an array.

There are multiple ways to remove duplicate elements from a JavaScript array:

A Set object can be used to store unique values of any type, including arrays. By converting the array into a set and then back into an array, we can easily remove any duplicates.

Example 1: Using Set:


<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>How to remove duplicate elements from JavaScript Array? - NiceSnippets.Com</title>
</head>
<body>
</body>
<script type="text/javascript">
    let arr = [1, 2, 3, 3, 4, 5, 5];
    let uniqueArr = [...new Set(arr)];
    console.log(uniqueArr); // Output: [1, 2, 3, 4, 5]
</script>
</html>

The filter() method creates a new array with all elements that pass the test implemented by the provided function. We can use it to create a new array with only unique elements.

Example 2: Using filter() method: 

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>How to remove duplicate elements from JavaScript Array? - NiceSnippets.Com</title>
</head>
<body>
</body>
<script type="text/javascript">
    let arr = [1, 2, 3, 3, 4, 5, 5];
    let uniqueArr = arr.filter((value,index) => {
        return arr.indexOf(value) === index;
    });
    console.log(uniqueArr); // Output: [1, 2, 3, 4 ,5]
</script>
</html>

The reduce() method executes a reducer function on each element of the array and returns a single output value. We can use it to create an object with unique keys (elements) and then extract them as an array.

Example 3: Using reduce() method: 

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>How to remove duplicate elements from JavaScript Array? - NiceSnippets.Com</title>
</head>
<body>
</body>
<script type="text/javascript">
    let arr = [1, 2 ,3 ,3 ,4 ,5 ,5];
    let obj = {};
    for(let i=0; i<arr.length; i++){
        obj[arr[i]] = true;
    }
    let uniqueArr = Object.keys(obj).map(Number);
    console.log(uniqueArr); // Output: [1 ,2 ,3 ,4 ,5]
</script>
</html>

More on this topic