Javascript: Remove duplicates from array

While working with javascript arrays, there is often a requirement to remove duplicates from an array. This article demonstrates easy ways to remove duplicate values from a javascript array using different methods and example illustrations.

Table of Contents:

• Remove duplicates from array in javascript using filter()
• Remove duplicates from array in javascript using sort()
• Remove duplicates from array in javascript using Set
• Remove duplicates from array in javascript using reduce()
• Remove duplicates from array in javascript using loops

Removing duplicates from array in javascript using filter()

Javascript’s filter() function will create a new array. This new array will contain only those elements from the calling array that pass the provided function.

Example:-

Remove duplicates from the array [“javascript”, “is”, “popular”,”language”,”is”,”language”,”popular”,”language”]

Code:-

function removeDuplicates(_array) {
    return  _array.filter(function(item, position) {
        return _array.indexOf(item) == position;
    })
}
//usage
let stringArray = ["javascript", "is", "popular","language","is","language","popular","language"];
finalArray = removeDuplicates(stringArray);
console.log(finalArray);

Output:-

[ 'javascript', 'is', 'popular', 'language' ]

Explanation:-

• In the above code, the original array is passed in the removeDuplicates() method.
• Within this method, for each element, the code checks if the first position is equal to the current position. The position is different in case the elements are duplicate.

Removing duplicates from array in javascript using sort()

Javascript’s sort() function will sort the elements of the array and will return the sorted array.

Example:-

Remove duplicates from the array [“javascript”, “is”, “popular”,”language”,”is”,”language”,”popular”,”language”]

Code:-

function removeDuplicates(_array) {
    return _array.sort().filter(function(item, position, _array2) {
        return !position || item != _array2[position - 1];
    });
}
//usage
finalArray = removeDuplicates(stringArray);
console.log(finalArray);

Output:-

[ 'javascript', 'is', 'popular', 'language' ]

Explanation:-

• In the above code, the original array is passed in the removeDuplicates() method.
• Within this method, the array elements are sorted first, and then if the elements are equal to the next, they are deleted.

Note that this method will not work with the array of objects.

Removing duplicates from array in javascript using Set

Javascript’s Set will store unique values

Example:-

Remove duplicates from the array [“javascript”, “is”, “popular”,”language”,”is”,”language”,”popular”,”language”]

Code:-

function removeDuplicates(_array) {
    return Array.from(new Set(_array));
 }
//usage
let stringArray = ["javascript", "is", "popular","language","is","language","popular","language"];
finalArray = removeDuplicates(stringArray);
console.log(finalArray);

Output:-

[ 'javascript', 'is', 'popular', 'language' ]

Explanation:-

• In the above code, the original array is passed in the removeDuplicates() method.
• Within this method, the Set will store only the unique values.

Note that SET can be used ES6 onwards.

Removing duplicates from array in javascript using reduce()

Javascript’s reduce() method will apply a callback function to all elements of the calling array. This callback function is also called “reducer.” As a final result, only one value is returned after applying the reducer on all elements of the calling array.

Example:-

Remove duplicates from array [“javascript”, “is”, “popular”,”language”,”is”,”language”,”popular”,”language”]

Code:-

function removeDuplicates(_array) {
    var finalArray = stringArray.reduce(function(i, j){
        if (i.indexOf(j) < 0 ) i.push(j);
        return i;
        },[]);   
      return finalArray;     
     }
//usage
let stringArray = ["javascript", "is", "popular","language","is","language","popular","language"];
let finalArray =[];
finalArray = removeDuplicates(stringArray);
console.log(finalArray);

Output:-

[ 'javascript', 'is', 'popular', 'language' ]

Removing duplicates from array in javascript using loops

Example:-

Remove duplicates from the array [“javascript”, “is”, “popular”,”language”,”is”,”language”,”popular”,”language”]

Code:-

   function removeDuplicates(_array){
          var arrayLength = _array.length;
          for(var i = 0; i < arrayLength; i++) 
           for(var j = i + 1; j < arrayLength; j++) 
              if(_array[j] == _array[i]){
                _array.splice(j,1);
                  j--;
                  arrayLength--;
              }
          return _array;
      }
      
      let stringArray = ["javascript", "is", "popular","language","is","language","popular","language"];
      finalArray = removeDuplicates(stringArray);
      console.log(finalArray);

Output:-

[ 'javascript', 'is', 'popular', 'language' ]

Explanation:-

• In the above code, the original array is passed in the removeDuplicates() method.
• Within this method, two loops are applied using variables i and j. The loop with j starts from the second element of the array and is run within the first loop.
• Inside the second loop, all the elements are traversed and compared with other elements.
• If any element is found repeated in the original array, that element is removed using slice().
• Finally, the array is returned with unique values. 

Read More:

• Javascript: Insert an item to array at specific index
• Javascript: Check if an array is empty
• Javascript: Convert array to string (4 ways)

I hope this article helped you in removing the duplicates from an array in javascript. Good Luck !!!