How to remove duplicate elements from JavaScript Array?

01-Jun-2023

.

Admin

How to remove duplicate elements from JavaScript Array?

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>

#JavaScript