Einführung in Sets in JavaScript (ES6)
Sets sind eine bemerkenswerte Erweiterung für JavaScript, die mit ES6 eingeführt wurde. In diesem Artikel werden wir uns genauer ansehen, was Sets sind, wie man sie in JavaScript einsetzt und welche nützlichen Methoden sie bieten.
Was genau sind Sets?
Wie der Name schon andeutet, ist ein Set eine Sammlung von eindeutigen Elementen. Das bedeutet, dass keine doppelten Werte gespeichert werden. Im Wesentlichen repräsentiert ein Set eine Gruppe von Elementen, bei der jedes Element nur einmal vorkommt.
Sets in JavaScript
In JavaScript speichern Sets ihre Elemente in der Reihenfolge, in der sie eingefügt wurden. Das bedeutet, dass die Reihenfolge der Elemente in einem Set festgelegt ist. Sets können primitive Datentypen (wie Zahlen oder Strings) oder Objekte aufnehmen.
Lassen Sie uns die Syntax von Sets in JavaScript ansehen.
Ich empfehle Ihnen, die Beispiele selbst auszuprobieren.
const namen = new Set(["John", "Harry", "Wick", "Jack", "Harry"]); console.log(namen); const zufallswort = new Set("Hiiiiiii"); console.log(zufallswort); const zahlen = new Set([5, 5, 5, 2, 1, 1, 2, 3]); console.log(zahlen);
Eigenschaften und Methoden von Sets
Sets bieten verschiedene Eigenschaften und Methoden, die wir nutzen können, um mit ihnen zu arbeiten und unterschiedliche Aufgaben zu lösen. Die wichtigsten Eigenschaften und Methoden werden im Folgenden erläutert:
Größe (Size)
Die size
-Eigenschaft gibt die Anzahl der Elemente zurück, die sich in einem Set befinden.
const namen = new Set(["John", "Harry", "Wick", "Jack", "Harry"]); console.log(`Anzahl der Elemente: ${namen.size}`);
Hinzufügen (add)
Die add
-Methode fügt dem Set ein neues Element hinzu. Wenn das Element bereits im Set vorhanden ist, wird es nicht erneut hinzugefügt.
const namen = new Set(); namen.add("John"); namen.add("Harry"); namen.add("Wick"); namen.add("Jack"); namen.add("Harry"); console.log(namen);
Prüfen auf Vorhandensein (has)
Die has
-Methode nimmt ein Argument entgegen und gibt true
zurück, wenn das Element im Set vorhanden ist. Andernfalls wird false
zurückgegeben.
const namen = new Set(["John", "Harry", "Wick", "Jack", "Harry"]); console.log(namen.has("Harry")); console.log(namen.has("Alley"));
Löschen (delete)
Die delete
-Methode löscht ein bestimmtes Element aus dem Set. Selbst wenn das Element nicht im Set vorhanden ist, tritt kein Fehler auf.
const namen = new Set(["John", "Harry", "Wick", "Jack", "Harry"]); namen.delete("John"); console.log(namen);
Einträge (entries)
Die entries
-Methode gibt einen Iterator zurück, der Arrays von Schlüssel-Wert-Paaren in der Reihenfolge der Einfügung enthält. In diesem Fall sind Schlüssel und Wert identisch.
const namen = new Set(["John", "Harry", "Wick", "Jack", "Harry"]); const eintraege = namen.entries(); console.log(eintraege.next().value); console.log(eintraege.next().value); console.log(eintraege.next().value); console.log(eintraege.next().value); console.log(eintraege.next().value);
Schlüssel (keys)
Die keys
-Methode gibt einen Iterator zurück, der die Set-Elemente in der Reihenfolge ihrer Einfügung enthält.
const namen = new Set(["John", "Harry", "Wick", "Jack", "Harry"]); const schluessel = namen.keys(); console.log(schluessel.next().value); console.log(schluessel.next().value); console.log(schluessel.next().value); console.log(schluessel.next().value); console.log(schluessel.next().value);
Werte (values)
Die values
-Methode, ähnlich wie keys
, gibt einen Iterator zurück, der die Set-Elemente in der Reihenfolge ihrer Einfügung enthält.
const namen = new Set(["John", "Harry", "Wick", "Jack", "Harry"]); const werte = namen.values(); console.log(werte.next().value); console.log(werte.next().value); console.log(werte.next().value); console.log(werte.next().value); console.log(werte.next().value);
Leeren (clear)
Die clear
-Methode entfernt alle Elemente aus dem Set.
const namen = new Set(["John", "Harry", "Wick", "Jack", "Harry"]); namen.clear(); console.log(namen);
Für jeden (forEach)
Die forEach
-Methode dient dazu, über die Elemente eines Sets zu iterieren.
const namen = new Set(["John", "Harry", "Wick", "Jack", "Harry"]); namen.forEach((element) => { console.log(element); });
Anwendungsbeispiel
Hier ist ein einfaches Beispiel, wie Sets in der Praxis genutzt werden können: Das Entfernen doppelter Werte aus einem Array. Die „Set“ Eigenschaft ist hier sehr nützlich.
So funktioniert es:
- Wir beginnen mit einem Array mit Duplikaten.
- Wir erstellen ein leeres Set.
- Wir iterieren über das Array und fügen jedes Element dem Set hinzu (Duplikate werden dabei automatisch eliminiert).
- Wir erstellen ein leeres Array.
- Wir iterieren über das Set und fügen jedes Element dem neuen Array hinzu.
- Wir geben das neue Array aus.
Versuchen Sie es selbst. Sollte es zu schwer sein, finden Sie die Lösung unten:
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);
Fazit
Mit diesem Wissen sind Sie nun in der Lage, mit Sets in JavaScript zu arbeiten und ihre Vorteile in Ihren Projekten zu nutzen. Sie bieten eine einfache und effektive Möglichkeit, mit eindeutigen Elementen zu arbeiten und können viele Probleme eleganter lösen. Viel Spaß beim Programmieren!