DEV Community

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

Posted on • Edited on

12 1

3 formas de remover duplicados en un Array en Javascript

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' ]
```



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

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



````javascript
let letras = ['A', 'B', 'A', 'C', 'B'];
letras.indexOf('B');
```
{% endraw %}


Esto regresa:
{% raw %}


````javascript
1
```



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



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

letras.forEach((elemento, index) => {
    console.log(`${elemento} - ${index} - ${letras.indexOf(elemento)}`);
});
```
{% endraw %}


Salida:
{% raw %}


````javascript
A - 0 - 0
B - 1 - 1
A - 2 - 0
C - 3 - 3
B - 4 - 1
```



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:



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

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

console.log(letrasUnicas);
```
{% endraw %}


Salida:
{% raw %}


````javascript
['A', 'B', 'C']
```



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



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

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

console.log(letrasDuplicadas);
```
{% endraw %}


salida:
{% raw %}


````javascript
['A', 'B']
```



## 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í:



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

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

console.log(letrasUnicas);
```
{% endraw %}


Salida:
{% raw %}


````javascript
['A', 'B', 'C']  
```



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.


<center>
Si te gusto el contenido puedes seguirme en mis redes sociales como @soyleninjs 
</center>

[![ko-fi](https://www.ko-fi.com/img/githubbutton_sm.svg)](https://ko-fi.com/G2G42SCZF)
Enter fullscreen mode Exit fullscreen mode

Top comments (0)

👋 Kindness is contagious

Immerse yourself in a wealth of knowledge with this piece, supported by the inclusive DEV Community—every developer, no matter where they are in their journey, is invited to contribute to our collective wisdom.

A simple “thank you” goes a long way—express your gratitude below in the comments!

Gathering insights enriches our journey on DEV and fortifies our community ties. Did you find this article valuable? Taking a moment to thank the author can have a significant impact.

Okay