Remove Duplicates From Array JavaScript

Remove Duplicates From Array JavaScript | Array is a data type used in all programming languages as well as JavaScript. It is one of the most primitive and widely used data types. In this article, we will learn how to remove duplicate elements from an array in JavaScript.

There are various methods and approaches which can be used to remove duplicate objects from array JavaScript. They are as follows:-

  1. Using the Set
  2. Using the filter() method
  3. Using the forEach() method

Remove Duplicates From Array JavaScript Using Set

Set is a data type that contains only unique elements. The set() JavaScript method takes an array as an argument and converts it to a set. Now, we can convert the set to an array using Array.from() method. The below program demonstrates it.

Program to Remove Duplicate Objects From the Array in JavaScript using Set and Array.from() Method

arr = [1, 2, 3, 2, 1, 3];

// remove duplicate using set
const set = new Set(arr);
console.log(set);

// convert set to array
newArr = Array.from(set);
console.log(newArr);

Output:-

Set(3) { 1, 2, 3 }
[ 1, 2, 3 ]

Let us see another program in JavaScript to remove duplicates from the array using Set and Array.from() Method

let arr = ['K', 'n', 'o', 'w', ' ', 'P', 'r', 'o', 'g', 'r', 'a', 'm'];

// remove duplicate using set
const set = new Set(arr);
console.log(set);

// convert set to array
newArr = Array.from(set);
console.log(newArr);

Output:-

Set(10) { ‘K’, ‘n’, ‘o’, ‘w’, ‘ ‘, ‘P’, ‘r’, ‘g’, ‘a’, ‘m’ }
[
‘K’, ‘n’, ‘o’, ‘w’,
‘ ‘, ‘P’, ‘r’, ‘g’,
‘a’, ‘m’
]

In the given array of characters, the following characters were duplicated:- ‘o’, and ‘r’. After converting the array to a set, those duplicate characters have been removed and later we converted the set to an array using Array.from() method.

Remove Duplicates From Array JavaScript Using filter() Method

The filter method() returns a new array with elements filtered by the condition we provide. We can provide the condition such that it can check for duplicates and filter them out. It can be considered the fastest way to remove duplicates from an array in JavaScript.

Program for the fastest way to remove duplicates from an array in JavaScript using the filter() Method

let arr = [1, 2, 3, 2, 1, 3, 4, 9];
let newArr = arr.filter((element, index) => arr.indexOf(element) === index);
console.log(newArr);

Output:-

[ 1, 2, 3, 4, 9 ]

In the above example, we use the indexOf() method along with the filter method. The indexOf() method returns the index of the first occurrence of the given element. If it is the same as the index value then it returns the element, or else it skips it. 

Another program in JavaScript to remove duplicates from the array using the filter() and indexOf() method

let arr = ['K', 'n', 'o', 'w', ' ', 'P', 'r', 'o', 'g', 'r', 'a', 'm'];
let newArr = arr.filter((element, index) => arr.indexOf(element) === index);
console.log(newArr);

Output:-

[
‘K’, ‘n’, ‘o’, ‘w’,
‘ ‘, ‘P’, ‘r’, ‘g’,
‘a’, ‘m’
]

JavaScript Remove Duplicates From Array Using the forEach() & include() method

The forEach() method in JavaScript is used to iterate over each element of an array. It takes a callback function as an argument and can be used to perform operations on each element. 

let arr = ['H', 'e', 'l', 'l', 'o', 'o', 'e'];

let uniqueArr = [];
arr.forEach((element) => {
    if (!uniqueArr.includes(element)) {
        uniqueArr.push(element);
    }
});

console.log(uniqueArr);

Output:-

[ ‘H’, ‘e’, ‘l’, ‘o’ ]

In the above program we are iterating the original array, and checking whether the current element exists in the new array (uniqueArr) or not. If it doesn’t exist then add that element else continue. At the end of the iteration, the new array will contain all the unique elements from the original array.

Another program in JavaScript to remove duplicates from the array using forEach() & include() method

let arr = [1, 2, 3, 2, 1, 3, 4, 9];

let uniqueArr = [];
arr.forEach((element) => {
    if (!uniqueArr.includes(element)) {
        uniqueArr.push(element);
    }
});

console.log(uniqueArr);

Output:-

[ 1, 2, 3, 4, 9 ]

If you enjoyed this post, share it with your friends. Do you want to share more information about the topic discussed above or do you find anything incorrect? Let us know in the comments. Thank you!

Leave a Comment

Your email address will not be published. Required fields are marked *