# hoe duplicaten van Array te verwijderen in ES6

hier zijn 3 manieren om duplicaten uit een array te filteren en alleen de unieke waarden terug te geven. Mijn favoriet is het gebruik van Set want het is de kortste en eenvoudigste 😁

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. Met behulp van set

laat me eerst beginnen door uit te leggen wat Set is:

Set is een nieuw data object geà ntroduceerd in ES6. Omdat Set u alleen unieke waarden laat opslaan. Wanneer u in een array passeert, worden dubbele waarden verwijderd.

Oké, laten we teruggaan naar onze code en opsplitsen wat er gebeurt. Er zijn 2 dingen gaande:

  1. eerst maken we een nieuwe Set door een array door te geven. Omdat Set alleen unieke waarden toestaat, worden alle duplicaten verwijderd.
  2. nu de duplicaten weg zijn, gaan we het terug converteren naar een array met behulp van de spread operator ...
const array = ;// Step 1const uniqueSet = new Set(array);// Set { '🐑', 1, 2, 3 }// Step 2const backToArray = ;// 

# converteer Set naar een Array met behulp van Array.van

u kunt ook Array.from gebruiken om een Set om te zetten in een array:

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

# 2: Met behulp van filter

om deze optie te begrijpen, laten we gaan door wat deze twee methoden doen: indexOf en filter

# indexOf

de indexOf methode geeft de eerste index terug die het vindt van het gegeven element uit onze array.

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

# filter

de filter() methode maakt een nieuwe array van elementen aan die de voorwaarde passeren die we bieden. Met andere woorden, als het element true passeert en retourneert, wordt het opgenomen in de gefilterde array. En elk element dat faalt of false retourneert, zal niet in de gefilterde array staan.

laten we in stappen en doorlopen wat er gebeurt als we door de array lus.

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;});

hieronder staat de uitvoer van de console.log hierboven getoond. De duplicaten zijn waar de index niet overeenkomt met de indexOf. Dus in die gevallen, zal de voorwaarde onwaar zijn en zal niet worden opgenomen in onze gefilterde array.

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

# Haal de dubbele waarden

We kunnen ook de filtermethode gebruiken om de dubbele waarden uit de array op te halen. We kunnen dit doen door gewoon onze conditie zo aan te passen:

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

nogmaals, laat stap door dit en zie de 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: Gebruikmakend van reduce

de reduce methode wordt gebruikt om de elementen van de array te verminderen en ze te combineren tot een uiteindelijke array gebaseerd op een reducer functie die u passeert.

In dit geval controleert onze reducerfunctie of onze uiteindelijke array het item bevat. Als het niet lukt, duw dat item in onze laatste reeks. Anders sla je dat element over en geef je alleen onze laatste array terug zoals het is (in wezen sla je dat element over).

verminderen is altijd wat lastiger om te begrijpen, dus laten we ook in elk geval stappen en de uitvoer bekijken:

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:// ;

en hier is de uitgang van de console.log:

Item Accumulator (vóór Reductiefunctie) Push to Accumulator? Accu (NA Reducer Functie)
🐑 Ja
1 Ja
2 Ja
🐑 Geen
🐑 Geen
3 Ja

# Communautaire inbreng

  • @smokku: array.includes(item) is een idiomatische manier om te testen of array het item bevat

  • @riquelkovsky: vandaag deed ik dit door het volgende te doen.Object.keys(array.reduce((map, next) => ({...map, : true}), {}))

-@luisiacc2: zeker, Set() zal de truc voor primitve waarden, met objecten een niet O(n^2) oplossing zou eerst het uitvoeren van een sort() op de array(die werkt in O(nlogn)), en dan zoeken naar de aangrenzende gelijke items(die O(n)) , dus je hebt O(n + nlogn).

  • @iamdipankarj: ook, Array.from(new Set()), maar dit werkt alleen op primitieven. Voor het filteren van duplicaten in array van aangepaste objecten Array.filter() is de juiste weg.

  • @benawad: filter looptijd is O(n^2)

Geef een antwoord

Het e-mailadres wordt niet gepubliceerd.