Imagen destacada del artículo Cómo eliminar elementos repetidos de un arreglo en JavaScript

Cómo eliminar elementos repetidos de un arreglo en JavaScript

javascript svg
actualizado: 15 / 01 / 2023

Los arreglos son una estructura de datos muy útil en JavaScript ya que permiten almacenar múltiples valores en una sola variable. Sin embargo, a veces es necesario eliminar elementos repetidos de un arreglo para poder trabajar con los datos de forma más efectiva.

En este artículo, te mostraré cómo eliminar elementos repetidos de un arreglo con JavaScript de diferentes formas

1 - Eliminar valores repetidos de un arreglo con .filter()

Gracias a este método puedes recorrer el arreglo y devolver un nuevo arreglo con todos los elementos que cumplen con una determinada condición.

Para eliminar elementos repetidos de un arreglo con .filter(), debes utilizar la función indexOf() para comprobar si el elemento se encuentra en el arreglo o no. Si el elemento no se encuentra en el arreglo, significa que es único y debe incluirse en el nuevo arreglo.

Por ejemplo:

js
let miArreglo = [1, 2, 3, 4, 5, 2, 3, 4];
let arregloSinRepetidos = miArreglo.filter(function (
elemento,
indice,
arreglo
) {
return arreglo.indexOf(elemento) === indice;
});
console.log(arregloSinRepetidos); // [1, 2, 3, 4, 5]

2 - Usando el método .reduce()

Este método reduce el arreglo a un único valor mediante la ejecución de una función para cada elemento.

Para eliminar elementos repetidos de un arreglo con .reduce(), debes crear una función que recorra el arreglo y, en caso de que el elemento no se encuentre en el arreglo resultado, lo agregue.

js
let miArreglo = [1, 2, 3, 4, 5, 2, 3, 4];
let arregloSinRepetidos = miArreglo.reduce(function (acumulador, elemento) {
if (acumulador.indexOf(elemento) === -1) {
acumulador.push(elemento);
}
return acumulador;
}, []);
console.log(arregloSinRepetidos); // [1, 2, 3, 4, 5]

Con el método .reduce(), puedes eliminar elementos repetidos de un arreglo de manera eficiente y sencilla. Sin embargo, debes tener en cuenta que este método puede ser más complicado de entender y usar que otras opciones.

3 - Eliminar elementos de un arreglo usando .forEach()

Este método recorre el arreglo y ejecuta una función para cada elemento del arreglo.

Para eliminar elementos repetidos de un arreglo con .forEach(), debes crear un objeto vacío y agregar cada elemento del arreglo al objeto si no se encuentra en él. Al final del proceso, el objeto contendrá todos los elementos únicos del arreglo.

js
let miArreglo = [1, 2, 3, 4, 5, 2, 3, 4];
let objetoSinRepetidos = {};
miArreglo.forEach(function (elemento) {
objetoSinRepetidos[elemento] = elemento;
});
let arregloSinRepetidos = Object.values(objetoSinRepetidos);
console.log(arregloSinRepetidos); // [1, 2, 3, 4, 5]

4 - Eliminar repetidos de un array con el método .set()

Este método crea un objeto que solo permite valores únicos como elementos.

Para eliminar elementos repetidos de un arreglo con .set(), debes crear un nuevo objeto Set a partir del arreglo y luego convertir el objeto Set a un arreglo con el método Array.from().

js
let miArreglo = [1, 2, 3, 4, 5, 2, 3, 4];
let setSinRepetidos = new Set(miArreglo);
let arregloSinRepetidos = Array.from(setSinRepetidos);
console.log(arregloSinRepetidos); // [1, 2, 3, 4, 5]
Artículos relacionados:
Cómo filtrar elementos de un array con filter javascript

Imagen destacada del artículo Cómo filtrar elementos de un array con filter javascript

Cómo insertar Javascript en HTML

Imagen destacada del artículo Cómo insertar Javascript en HTML

Eliminar el primer y ultimo carácter de una cadena en javascript

Imagen destacada del artículo Eliminar el primer y ultimo carácter de una cadena en javascript

Cómo eliminar elementos de un arreglo en JavaScript

Imagen destacada del artículo Cómo eliminar elementos de un arreglo en JavaScript

Gatsby JS - introducción, ventajas y usos

Imagen destacada del artículo Gatsby JS - introducción, ventajas y usos

Introducción a Nextjs

Imagen destacada del artículo Introducción a Nextjs

Calcular cuantos días hay entre dos fechas con javascript

Imagen destacada del artículo Calcular cuantos días hay entre dos fechas con javascript

Cómo insertar un elemento en un índice específico de un array en Javascript

Imagen destacada del artículo Cómo insertar un elemento en un índice específico de un array en Javascript