Cómo eliminar elementos repetidos de un arreglo en JavaScript

Actualizado : 2023-10-04

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:

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.

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.

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 usando el obetjo 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().

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]

Juneiker Castillo freelance web developer

Soy Juneiker Castillo, un desarrollador web frontend apasionado por la programación y la creación de sitios web modernos rápidos y escalables, en fin un friki 🤓 de javascript enamorado de react js ⚛️.

Sobre mi