DEV Community 👩‍💻👨‍💻

Cover image for 3 formas de remover duplicados en un Array en Javascript
Lenin Felix
Lenin Felix

Posted on • Updated on

3 formas de remover duplicados en un Array en Javascript

promo

Vamos a checar, muchas veces (o pocas) surge la necesidad de eliminar elementos duplicados dados en un array, que se yo... puede ser por que tienes que imprimir una lista del super, quitar a un alumno que duplico su registro en un form, infinidad de cosas, así que vamos a ver algunas formas de hacer esto:

1) Usando Set

Usando Set(), se creara una instancia de valores únicos, implícitamente al usar esta instancia borrara los duplicados .

Así que podemos hacer uso de esta instancia y de ahi tendremos que convertir esa instancia en un nuevo array, y eso seria todo:

let letras = ['A', 'B', 'A', 'C', 'B'];
let letrasUnicas = [...new Set(letras)];

console.log(letrasUnicas);
Enter fullscreen mode Exit fullscreen mode

Esto nos regresa:

[ 'A', 'B', 'C' ]
Enter fullscreen mode Exit fullscreen mode

2) Usando los métodos indexOf() y filter()

El método indexOf() regresa el índice de la primer aparicion del elemento en el array:

let letras = ['A', 'B', 'A', 'C', 'B'];
letras.indexOf('B');
Enter fullscreen mode Exit fullscreen mode

Esto regresa:

1
Enter fullscreen mode Exit fullscreen mode

El elemento duplicado es el elemento cuyo índice es diferente de su valor de indexOf():

let letras = ['A', 'B', 'A', 'C', 'B'];

letras.forEach((elemento, index) => {
    console.log(`${elemento} - ${index} - ${letras.indexOf(elemento)}`);
});
Enter fullscreen mode Exit fullscreen mode

Salida:

A - 0 - 0
B - 1 - 1
A - 2 - 0
C - 3 - 3
B - 4 - 1
Enter fullscreen mode Exit fullscreen mode

Para eliminar los duplicados, se utiliza el método filter() para incluir sólo los elementos cuyos índices coinciden con sus valores indexOf, ya que sabemos que el método filer regresa un nuevo array con base a las operaciones que se hacen dentro de este:

let letras = ['A', 'B', 'A', 'C', 'B'];

let letrasUnicas = letras.filter((elemento, index) => {
    return letras.indexOf(elemento) === index;
});

console.log(letrasUnicas);
Enter fullscreen mode Exit fullscreen mode

Salida:

['A', 'B', 'C']
Enter fullscreen mode Exit fullscreen mode

Y si de casualidad necesitamos los duplicados, podemos modificar un poco nuestras función, solo con cambiar nuestra regla:

let letras = ['A', 'B', 'A', 'C', 'B'];

let letrasDuplicadas = letras.filter((elemento, index) => {
    return letras.indexOf(elemento) !== index;
});

console.log(letrasDuplicadas);
Enter fullscreen mode Exit fullscreen mode

salida:

['A', 'B']
Enter fullscreen mode Exit fullscreen mode

3) Usando los métodos includes() y forEach()

La función include() devuelve true si un elemento está en un array o false si no lo está.

El siguiente ejemplo itera sobre los elementos de un array y añade a un nuevo array sólo los elementos que no están ya allí:

let letras = ['A', 'B', 'A', 'C', 'B'];

let letrasUnicas = [];
letras.forEach((elemento) => {
    if (!letrasUnicas.includes(elemento)) {
        letrasUnicas.push(elemento);
    }
});

console.log(letrasUnicas);
Enter fullscreen mode Exit fullscreen mode

Salida:

['A', 'B', 'C']  
Enter fullscreen mode Exit fullscreen mode

Básicamente, tenemos opciones para solucionar este tipo de problemas, así que no te estanques mas y puedes usar cualquiera que te resulta mas atractiva.


Si te gusto el contenido puedes seguirme en mis redes sociales como @soyleninjs

ko-fi

promo

Top comments (0)

🌚 Life is too short to browse without dark mode