Eliminar los duplicados de un array en JavaScript

Moataz Farid 12 octubre 2023
  1. Usa Set para eliminar los duplicados en JavaScript con la sintaxis de ECMAScript 6 spread
  2. Utilice Array.filter() para eliminar los duplicados del array de JavaScript
  3. Usar hashtable para eliminar el duplicado de un array primitivo en JavaScript
  4. Use la función _.uniq() de las librerías underscore y LoDash para eliminar los duplicados de los arrays en JavaScript
Eliminar los duplicados de un array en JavaScript

Este tutorial explicará cómo podemos eliminar los duplicados de un array en JavaScript utilizando diferentes métodos. Uno de los métodos es pasar el array de destino al constructor de la clase Set para devolver un array equivalente no duplicado. Otra forma es usar el método filter() del array de JavaScript e implementar la condición de prueba en su función de devolución.

Usa Set para eliminar los duplicados en JavaScript con la sintaxis de ECMAScript 6 spread

En Matemáticas, el conjunto contiene un grupo de elementos únicos y no duplicados. En JavaScript, la clase Set puede obtener todos esos elementos no duplicados de un conjunto.

Con ECMAScript 6, podemos usar el poder de la sintaxis de difusión usando la clase Set para obtener un nuevo conjunto de no-duplicados de los que enviamos al Set() constructor.

var arr = [1, 2, 3, 4, 1, 2, 3, 1, 2, 3]

    var uniqueArr = [...new Set(arr)]

console.log(uniqueArr)

Resultado:

[1, 2, 3, 4]

Utilice Array.filter() para eliminar los duplicados del array de JavaScript

del array de JavaScript introdujo una de las funciones de orden superior llamada filter(), que hace bucles en cada elemento del array, aplica una condición de prueba en él, y sólo devuelve ese elemento si cumple la condición. Esta condición de prueba se implementará dentro de la función de devolución de llamada, pasada como un argumento al método filter().

Podemos eliminar los duplicados del array estableciendo la condición de prueba para comprobar si el índice del elemento actual en bucle es la primera ocurrencia en ese array. La función filter() tomará el argumento extra pos que representará el índice del array del elemento durante la ejecución.

var arrTwo = ['Hello 1 ', ' Hello 2 ', 'Hello 1 ', ' Hello 2 ', 'Hello 1 again']

    const filteredArray = arrTwo.filter(function(ele, pos) {
      return arrTwo.indexOf(ele) == pos;
    })

console.log('The filtered array ', filteredArray);

Resultado:

The filtered array  (3) ["Hello 1 ", " Hello 2 ", "Hello 1 again"]

Si podemos usar la sintaxis de las flechas de JavaScript ECMAScript 6, que la eliminación de la operación de duplicado se implemente de una mejor manera.

var arrTwo =
    ['Hello 1 ', ' Hello 2 ', 'Hello 1 ', ' Hello 2 ', 'Hello 1 again'];
const filteredArray = arrTwo.filter((ele, pos) => arrTwo.indexOf(ele) == pos);
console.log('The filtered array', filteredArray);

Resultado:

The filtered array  (3) ["Hello 1 ", " Hello 2 ", "Hello 1 again"]

Usar hashtable para eliminar el duplicado de un array primitivo en JavaScript

Si tenemos un array compuesta sólo por tipos primitivos como los números [ 1, 2, 3, 4, 1, 2, 3 ] y queremos eliminar los duplicados de esa array [ 1, 2, 3, 4 ] podemos implementar nuestra función filterArray() usando hashtables.

Construiremos un objeto temporal llamado found que incluirá todos los valores no duplicados. Dentro de la función filter, nuestra condición devolverá false si el elemento ya existe en el objeto found; de lo contrario, añadiremos ese elemento al objeto found con el valor true;

var arrThree =
    [
      'Hello 1 ', ' Hello 2 ', ' Hello 2 ', 'Welcome', 'Hello 1 again',
      'Welcome', 'Goodbye'
    ]

    function filterArray(inputArr) {
      var found = {};
      var out = inputArr.filter(function(element) {
        return found.hasOwnProperty(element) ? false : (found[element] = true);
      });
      return out;
    }

const outputArray = filterArray(arrThree);
console.log('Original Array', arrThree);
console.log('Filtered Array', outputArray);

Resultado:

Original Array ["Hello 1 ", " Hello 2 ", " Hello 2 ", "Welcome", "Hello 1 again", "Welcome", "Goodbye"]
Filtered Array ["Hello 1 ", " Hello 2 ", "Welcome", "Hello 1 again", "Goodbye"]

Use la función _.uniq() de las librerías underscore y LoDash para eliminar los duplicados de los arrays en JavaScript

Si ya estamos usando cualquiera de los métodos de la biblioteca underscore, podemos usar el método uniq(), ya que devuelve sólo la primera ocurrencia del elemento del array de entrada.

var arrFive = [1, 2, 3, 1, 5, 2];

console.log('LoDash output', _.uniq(arrFive));
LoDash output [1, 2, 3, 5]

podemos importar la biblioteca desde aquí.

Artículo relacionado - JavaScript Array