# Come rimuovere i duplicati di array in ES6

Ecco 3 modi per filtrare i duplicati da un array e restituire solo i valori univoci. Il mio preferito sta usando Set perché è il più breve e semplice 😁

const array = ;// 1: "Set";// 2: "Filter"array.filter((item, index) => array.indexOf(item) === index);// 3: "Reduce"array.reduce( (unique, item) => (unique.includes(item) ? unique : ), ,);// RESULT:// ;

# 1. Usando set

Fammi iniziare prima spiegando quale Set è:

Set è un nuovo oggetto dati introdotto in ES6. Perché Set consente solo di memorizzare valori univoci. Quando si passa in un array, rimuoverà tutti i valori duplicati.

Ok, torniamo al nostro codice e analizziamo cosa sta succedendo. Ci sono 2 cose in corso:

  1. Innanzitutto, stiamo creando un nuovo Set passando un array. Poiché Set consente solo valori univoci, tutti i duplicati verranno rimossi.
  2. Ora i duplicati sono spariti, lo convertiremo in un array usando l’operatore di diffusione ...
const array = ;// Step 1const uniqueSet = new Set(array);// Set { '🐑', 1, 2, 3 }// Step 2const backToArray = ;// 

# Converti Impostato su un array usando Array.da

In alternativa, puoi anche usare Array.from per convertire un Set in un array:

const array = ;Array.from(new Set(array));// 

# 2: Usando filter

Per capire questa opzione, esaminiamo cosa stanno facendo questi due metodi: indexOf e filter

# indexOf

Il metodo indexOf restituisce il primo indice che trova dell’elemento fornito dal nostro array.

const array = ;array.indexOf('🐑'); // 0array.indexOf(1); // 1array.indexOf(2); // 2array.indexOf(3); // 5

# filter

Il metodo filter() crea un nuovo array di elementi che passano il condizionale che forniamo. In altre parole, se l’elemento passa e restituisce true, verrà incluso nell’array filtrato. E qualsiasi elemento che fallisce o restituisce false, NON sarà nell’array filtrato.

Entriamo e attraversiamo ciò che accade mentre attraversiamo l’array.

const array = ;array.filter((item, index) => { console.log( // a. Item item, // b. Index index, // c. indexOf array.indexOf(item), // d. Condition array.indexOf(item) === index, ); return array.indexOf(item) === index;});

Di seguito è riportato l’output dalla console.log mostrato sopra. I duplicati sono dove l’indice non corrisponde all’indice. Quindi, in questi casi, la condizione sarà falsa e non sarà inclusa nel nostro array filtrato.

Item Index indexOf Condition
🐑 0 0 true
1 1 1 true
2 2 2 true
🐑 3 0 false
🐑 4 0 false
3 5 5 true

# Recuperare i valori duplicati

Possiamo anche utilizzare il metodo di filtro per recuperare i valori duplicati dalla matrice. Possiamo farlo semplicemente regolando la nostra condizione in questo modo:

const array = ;array.filter((item, index) => array.indexOf(item) !== index);// 

Ancora una volta, lascia passare attraverso questo e vedere l’output:

Item Index indexOf Condition
🐑 0 0 false
1 1 1 false
2 2 2 false
🐑 3 0 true
🐑 4 0 true
3 5 5 false

# 3: Utilizzando reduce

Il metodo reduce viene utilizzato per ridurre gli elementi dell’array e combinarli in un array finale basato su alcune funzioni di riduttore che si passano.

In questo caso, la nostra funzione riduttore sta controllando se il nostro array finale contiene l’elemento. Se non lo fa, spingere quell’elemento nella nostra matrice finale. Altrimenti, salta quell’elemento e restituisci solo il nostro array finale così com’è (essenzialmente saltando quell’elemento).

Ridurre è sempre un po ‘ più difficile da capire, quindi entriamo anche in ogni caso e vediamo l’output:

const array = ;array.reduce((unique, item) => { console.log( // a. Item item, // b. Final Array (Accumulator) unique, // c. Condition (Remember it only get pushed if this returns `false`) unique.includes(item), // d. Reducer Function Result unique.includes(item) ? unique : , ); return unique.includes(item) ? unique : ;}, ); // 👈 The initial value of our Accumulator is an empty array// RESULT:// ;

Ed ecco l’output dalla console.registro:

Articolo Accumulatore(PRIMA della funzione riduttore) Push to Accumulatore? Accumulatore (DOPO il Riduttore di Funzione)
🐑
1
2
🐑 No
🐑 No
3

# Contributo comunitario

  • @smokkku: array.includes(item) è un modo più idiomatico di verificare se l’array contiene l’elemento

  • @riquelkovsky: Proprio oggi ho fatto questo facendo quanto segue.Object.keys(array.reduce((map, next) => ({...map, : true}), {}))

-@luisiacc2: Certo, Set() farà il trucco per i valori primitve, con oggetti una soluzione non O(n^2) eseguirà prima un sort() sull’array(che opera in O(nlogn)), e quindi cercherà gli elementi uguali degli adiacenti(che è O(n)) , quindi hai O(n + nlogn).

  • @idipankarj: Anche, Array.from(new Set()), ma questo funziona solo su primitive. Per filtrare i duplicati in array di array di oggetti personalizzati.filter() è la strada da percorrere.

  • @benawad: filter il tempo di esecuzione è O(n^2)

Lascia un commento

Il tuo indirizzo email non sarà pubblicato.