Eliminar duplicados de un vector JavaScript

Localizar los valores únicos que contiene un vector es una tarea con la que posiblemente nos encontremos de forma habitual. Algo que ya hemos visto cómo solucionar en Python y en Excel. A continuación, vamos a ver tres métodos para eliminar los valores duplicados de un vector JavaScript y comparar su rendimiento.

forEach

Quizás el método más sencillo para obtener los valores únicos de un vector es iterar sobre él e ir guardando los valores nuevos en una nueva variable. Al final la nueva variable contendrá los valores únicos. Esto se puede hacer iterando con el método forEach() y buscar los valores nuevos con includes(). Métodos que se encuentran en todos los vectores JavaScript. Así se posible encontrar los valores únicos simplemente con el siguiente código

let values = [1, 4, 2, 2, 6, 1, 7, 4]

let unique = []

values.forEach(name => {
	if(!unique.includes(name)) {
		unique.push(name);
	}
})

console.log(unique);

[ 1, 4, 2, 6, 7 ]

Al sacar el vector a través de la consola se puede ver que solamente se encuentran los valores únicos, eliminado los duplicados

filter

Otro método que puede ser también intuitivo es filter(), con el que podemos filtrar los vectores. Así para eliminar los duplicados solamente necesitamos encontrar los valores cuyo índice se corresponda con la primera aparición en la lista. Posición que se puede obtener fácilmente con el método indexOf(). Así, otro código con el que se pueden obtener los valores únicos es el siguiente.

unique = values.filter((v,i) => values.indexOf(v) === i)
console.log(unique);

[ 1, 4, 2, 6, 7 ]

Un método que es más compacto que el anterior.

Set

Finalmente, otro método puede ser convertir el vector original en un Set y volver a convertir este en vector. Lo que nos dará otra vez los valores únicos del original. Algo tan sencillo como la siguiente línea.

unique = [...new Set(values)];
console.log(unique);

[ 1, 4, 2, 6, 7 ]

Comparación de rendimiento

Hemos visto tres formas de ordenar los valores únicos en un vector de JavaScript. Pero, si vamos a trabajar con vectores grandes, es importante saber cuál es el más rápido de los tres métodos. Algo que se puede comparar comprobando el rendimiento con un vector de 10 millones de registros y midiendo el tiempo que tarda cada uno de los métodos que hemos visto.

values = Array(10000000).fill().map(_ =>  Math.round(Math.random() * 10));

let start = new Date();

values.forEach(name => {
	if(!unique.includes(name)) {
		unique.push(name);
	}
})

let end = new Date() - start;
console.log(`Tiempo de ejecución forEach: ${end} ms`);

start = new Date();

unique = values.filter((v,i) => values.indexOf(v) === i)

end = new Date() - start;
console.log(`Tiempo de ejecución filter: ${end} ms`);

start = new Date();

unique = [...new Set(values)];

end = new Date() - start;
console.log(`Tiempo de ejecución Set: ${end} ms`);

Tiempo de ejecución forEach: 371 ms
Tiempo de ejecución filter: 390 ms
Tiempo de ejecución Set: 181 ms

Con lo que se puede concluir que el método más rápido es Set tarda menos de la mitad que forEach y filter, ambos en valores muy próximos. Por lo que, para grandes vectores, es aconsejable usar Set en lugar de los otros métodos.

Conclusiones

Hemos visto tres métodos para eliminar valores duplicados de un vector JavaScript y comprobar cuál de ellos es más rápido. Posiblemente forEach y filter sean los más intuitivos, pero no son los más eficientes a la hora de trabajar con grandes conjuntos de datos. Aunque todos ellos son rápidos, ya que pueden procesar diez millones de registros en pocos milisegundos.

Imagen de alessandra barbieri en Pixabay