4 ways to remove duplicates elements from an array with Javascript

Matías Hernández: [0:00] To remove duplicates from an array is a common task. You can use the Array.filter method along with the Array.indexOf to create a new array with all duplicate elements. Array.filter creates a new array with the elements that accomplish the given condition. In other words, if the element pass the condition, it returns true and will be added to the new array.

[0:21] Array.indexOf returns the first index of the array where the given element is found. In this case, you can identify the duplicate when the index is not the same as the result of indexOf. We can see in the screen the result of in the new array.

[0:35] You can also use the Set object. Set is another structure that will store unique values. To use it, you create a new set basic on the inner array and then transform the set to a new array by using the spread syntax.

[0:49] Array.reduce method can also be used with the same purpose. Array.reduce execute a function over each element of the array and returns a unique value as a result. It receives two parameters -- a function called reducer that holds at least two arguments, the accumulator and the current item, and there's a second parameter [inaudible] , in this case, an empty array.

[1:11] In this example, the reducer function check if the current item is already included in the resulting array identified by the [inaudible] variable. If not, it just push the item into the accumulator. This creates a new array free of duplicate.

[1:25] Array.forEach is another way to move over the array and such it can be used to remove duplicates but in an imperative way. Here you need to use an [inaudible] array to hold the non-duplicate elements. By looping over the array, you use a condition block to verify that the item is not already available on the resulting array by using array.includes. Then you have a new array with unique values.

[1:49] In summary, there are many options to remove duplicates, but all use the same premise -- iterate over the array to check if the item exists or not or use some more complex data structures as said.