Remove Duplicate Elements from JavaScript Array
Last Updated :
17 Jan, 2024
JavaScript array is a single variable that is used to store the elements or a group of values. An array can contain multiple occurrences or duplicates of an element that can be removed using the below-discussed methods.
Methods to Remove Duplicate Elements from JavaScript Array
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 JavaScript array.
Javascript
let arr = [ "apple" , "mango" , "apple" ,
"orange" , "mango" , "mango" ];
function removeDuplicates(arr) {
return arr.filter((item,
index) => arr.indexOf(item) === index);
}
console.log(removeDuplicates(arr));
|
Output
[ 'apple', 'mango', 'orange' ]
This method sets a new object type with ES6 (ES2015) that allows you to create collections of unique values.
Example: This example uses the JavaScript set() method to remove duplicates from an array.
Javascript
let arr = [ "apple" , "mango" , "apple" ,
"orange" , "mango" , "mango" ];
function removeDuplicates(arr) {
return [... new Set(arr)];
}
console.log(removeDuplicates(arr));
|
Output
[ 'apple', 'mango', 'orange' ]
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 JavaScript array in the below code.
Javascript
let arr = [ "apple" , "mango" ,
"apple" , "orange" , "mango" , "mango" ];
function removeDuplicates(arr) {
let unique = [];
arr.forEach(element => {
if (!unique.includes(element)) {
unique.push(element);
}
});
return unique;
}
console.log(removeDuplicates(arr));
|
Output
[ 'apple', 'mango', 'orange' ]
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 JavaScript.
Javascript
let arr = [ "apple" , "mango" ,
"apple" , "orange" , "mango" , "mango" ];
function removeDuplicates(arr) {
let unique = arr.reduce( function (acc, curr) {
if (!acc.includes(curr))
acc.push(curr);
return acc;
}, []);
return unique;
}
console.log(removeDuplicates(arr));
|
Output
[ 'apple', 'mango', 'orange' ]
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.
Javascript
let arr = [ "apple" , "mango" ,
"apple" , "orange" , "mango" , "mango" ];
function removeDuplicates(arr) {
let unique = [];
for (i = 0; i < arr.length; i++) {
if (unique.indexOf(arr[i]) === -1) {
unique.push(arr[i]);
}
}
return unique;
}
console.log(removeDuplicates(arr));
|
Output
[ 'apple', 'mango', 'orange' ]
Method 6: 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.
Example: The _.uniq() function of the underscore.js library is used in the below code to remove elements from an array.
HTML
<!DOCTYPE html>
< html >
< head >
< script src =
</ script >
</ head >
< body >
< script type = "text/javascript" >
console.log(_.uniq([1, 2, 3, 4, 5, 4, 3, 2, 1]));
</ script >
</ body >
</ html >
|
Output:
Like Article
Suggest improvement
Share your thoughts in the comments
Please Login to comment...