Et nytt tillegg til JavaScript i ES6 er «Set». La oss utforske hva dette innebærer.
Hva er egentlig et «Set»?
Hvordan kan vi bruke «Set» i JavaScript?
Hvilke metoder finnes for å løse ulike problemstillinger?
I denne veiledningen vil vi gå gjennom alle disse spørsmålene.
Set-strukturer
Som navnet antyder, er et «Set» en samling av distinkte elementer. Det vil si at «Set» ikke lagrer dupliserte verdier.
I JavaScript lagrer et «Set» elementene i den rekkefølgen de ble lagt til. Dette betyr at elementene er sortert etter innsetting. «Set» kan lagre primitive datatyper eller objekter.
La oss se på syntaksen for å opprette et «Set» i JavaScript.
Jeg anbefaler at du har en IDE klar for å øve på eksemplene som følger.
const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);
console.log(names);
const randomWord = new Set("Hiiiiiii");
console.log(randomWord);
const numbers = new Set([5, 5, 5, 2, 1, 1, 2, 3]);
console.log(numbers);
Egenskaper og metoder for «Set»
«Set» har en rekke egenskaper og metoder som gjør det enkelt å manipulere data og løse problemer. Disse egenskapene og metodene er lette å forstå, og navngivningen gjør det intuitivt å bruke dem. La oss se nærmere på noen av dem:
størrelse
Egenskapen `size` returnerer antall elementer som finnes i settet.
const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);
console.log(`Størrelse: ${names.size}`);
legge til
Metoden `add` brukes til å legge til et nytt element i settet. Hvis elementet allerede finnes i settet, vil det ikke bli lagt til igjen.
// Tomt set
const names = new Set();
names.add("John");
names.add("Harry");
names.add("Wick");
names.add("Jack");
names.add("Harry");
console.log(names);
har
Metoden `has` tar et argument og returnerer `true` hvis elementet finnes i settet, og `false` ellers.
const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);
console.log(names.has("Harry"));
console.log(names.has("Alley"));
slette
Som forventet, tar metoden `delete` et argument og fjerner det fra settet. Hvis argumentet ikke finnes i settet, vil det ikke oppstå noen feil.
const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);
names.delete("John");
console.log(names);
oppføringer
Metoden `entries` returnerer en iterator som inneholder matriser med nøkkel-verdi-par i innsettingsrekkefølgen. I dette tilfellet er nøkkelen og verdien det samme.
const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);
const entries = names.entries();
console.log(entries.next().value);
console.log(entries.next().value);
console.log(entries.next().value);
console.log(entries.next().value);
console.log(entries.next().value);
nøkler
Metoden `keys` returnerer en iterator som inneholder settets elementer i innsettingsrekkefølgen.
const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);
const keys = names.keys();
console.log(keys.next().value);
console.log(keys.next().value);
console.log(keys.next().value);
console.log(keys.next().value);
console.log(keys.next().value);
verdier
Metoden `values` returnerer en iterator som inneholder settets elementer i innsettingsrekkefølgen, akkurat som metoden `keys`.
const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);
const values = names.values();
console.log(values.next().value);
console.log(values.next().value);
console.log(values.next().value);
console.log(values.next().value);
console.log(values.next().value);
klar
Metoden `clear` fjerner alle elementene fra settet.
const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);
names.clear();
console.log(names);
forHver
Metoden `forEach` brukes til å iterere over elementene i settet og hente dem en etter en.
const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);
names.forEach((element) => {
console.log(element);
});
Eksempelbruk
La oss se på et enkelt eksempel der vi bruker «Set» til å fjerne duplikater fra en array.
Slik løser vi problemet:
- Opprett en array med testdata.
- Opprett et tomt «Set».
- Gå gjennom alle elementene i arrayen.
- Legg hvert element til «Set».
- «Set» vil automatisk fjerne duplikatene.
- Opprett en tom array.
- Gå gjennom alle elementene i «Set» og legg dem til den nye arrayen.
- Skriv ut den nye arrayen.
Jeg håper du kan løse dette på egen hånd. Hvis du synes det er vanskelig å kode, kan du se løsningen nedenfor:
const arr = ["John", "Harry", "Wick", "Jack", "Harry"];
const temp = new Set();
arr.forEach((element) => {
temp.add(element);
});
const newArr = [];
temp.forEach((element) => {
newArr.push(element);
});
console.log(newArr);
Konklusjon
Nå har du tilegnet deg den kunnskapen du trenger for å jobbe med «Set» i JavaScript. Du kan trygt bruke dette i ditt neste prosjekt. Vær kreativ og utforsk alle mulighetene!
Lykke til med kodingen 👨💻