4 formas de remover elementos duplicados de un arreglo con Javascript

Matías Hernández: [0:00] Eliminar duplicado con arreglo es una tarea común. Puedes utilizar el elemento Array.filter junto con Array.indexOf para crear un nuevo arreglo sin elementos duplicados. Y Array.filter crea un nuevo arreglo con los elementos que compran la condición dada. Es decir, si el elemento pasa a la condición se retorna true, indicando que este será agregado al nuevo arreglo.

[0:19] Array.indexOf retorna al primer índice del arreglo en donde se encuentre un elemento dado. En este caso, podemos identificar un duplicado cuando el índice no es igual al resultado de indexOf. Así obtenemos un nuevo arreglo que podemos ver en pantalla sin duplicados.

[0:33] Entonces bien, puedes utilizar el objeto Set. Set es una estructura de datos que almacena valores únicos. Para esto simplemente creamos una offset basada en nuestro arreglo original y después compartimos dicho Set a un arreglo nuevamente utilizando la sintaxis spread. Esto nos da como resultado un nuevo arreglo sin valores duplicados.

[0:52] El método Array.reduce también puede ser utilizado con el mismo propósito. Array.reduce ejecuta una función sobre cada elemento y retorna un valor como método del resultado. Array.reduce recibe dos parámetros, una función llamada reductora que tiene al menos dos argumentos, el acumulador y el ítem actual de la iteración, y como segundo parámetro el valor inicial, en este caso un arreglo vacío.

[1:15] Para este ejemplo, la función utilizada simplemente revisa si el ítem actual se encuentra dentro del resultado identificado por la variable acc. De no estarlo, simplemente agrega el valor al acumulador. Como resultado tenemos un nuevo arreglo sin valores duplicados.

[1:30] Array.forEach es otra forma de iterar sobre el arreglo, y como tal también permite remover duplicados, pero de una forma más imperativa. Aquí utilizamos un arreglo auxiliar para almacenar los elementos no duplicados. Y al iterar sobre el arreglo se utiliza un bloque condicional que verifica que el ítem no exista ya en el elemento de valores únicos utilizando Array.includes.

[1:50] En resumen, las opciones para eliminar duplicados son variadas, pero se sustentan en la misma premisa. El uso de iteraciones para corroborar si un elemento ya existe o no y el uso de estructura de datos más complejas como Set.