JavaScript Set und WeakSet

In diesem Tutorial lernen Sie anhand von Beispielen JavaScript-Sets und WeakSets kennen.

Das JavaScript ES6 hat zwei neue Datenstrukturen eingeführt, nämlich Setund WeakSet.

Set ähnelt einem Array, mit dem mehrere Elemente wie Zahlen, Zeichenfolgen, Objekte usw. gespeichert werden können. Im Gegensatz zu einem Array kann ein Set jedoch keine doppelten Werte enthalten.

Erstellen Sie ein JavaScript-Set

Um ein zu erstellen Set, müssen Sie den new Set()Konstruktor verwenden. Beispielsweise,

 // create Set const set1 = new Set(); // an empty set console.log(set1); // Set () // Set with multiple types of value const set2 = new Set((1, 'hello', (count : true))); console.log(set2); // Set (1, "hello", (count: true))

Wenn doppelte Werte an ein SetObjekt übergeben werden, werden die doppelten Werte ausgeschlossen.

 // Set with duplicate values const set3 = new Set((1, 1, 2, 2)); console.log(set3); // Set (1, 2)

Zugriff auf Set-Elemente

Sie können auf SetElemente , die die Verwendung von values()Verfahren und prüfen , ob ein Element im Innern ist Setmit has()Methode. Beispielsweise,

 const set1 = new Set((1, 2, 3)); // access the elements of a Set console.log(set1.values()); // Set Iterator (1, 2, 3)

Mit dieser has()Methode können Sie überprüfen, ob sich das Element in einem Set befindet. Beispielsweise,

 const set1 = new Set((1, 2, 3)); // check if an element is in Set console.log(set1.has(1));

Neue Elemente hinzufügen

Mit der add()Methode können Sie einem Set Elemente hinzufügen . Beispielsweise,

 const set = new Set((1, 2)); console.log(set.values()); // adding new elements set.add(3); console.log(set.values()); // adding duplicate elements // does not add to Set set.add(1); console.log(set.values());

Ausgabe

 Iterator einstellen (1, 2) Iterator einstellen (1, 2, 3) Iterator einstellen (1, 2, 3)

Elemente entfernen

Mit clear()der delete()Methode und können Sie Elemente aus einem Set entfernen.

Die delete()Methode entfernt ein bestimmtes Element aus a Set. Beispielsweise,

 const set = new Set((1, 2, 3)); console.log(set.values()); // Set Iterator (1, 2, 3) // removing a particular element set.delete(2); console.log(set.values()); // Set Iterator (1, 3)

Die clear()Methode entfernt alle Elemente aus a Set. Beispielsweise,

 const set = new Set((1, 2, 3)); console.log(set.values()); // Set Iterator (1, 2, 3) // remove all elements of Set set.clear(); console.log(set.values()); // Set Iterator ()

Sätze iterieren

Sie können die Set-Elemente mit der for… of-Schleife oder der forEach () -Methode durchlaufen. Auf die Elemente wird in der Einfügereihenfolge zugegriffen. Beispielsweise,

 const set = new Set((1, 2, 3)); // looping through Set for (let i of set) ( console.log(i); )

Ausgabe

 1 2 3

JavaScript WeakSet

Das WeakSet ähnelt einem Set. WeakSet kann jedoch nur Objekte enthalten, während ein Set beliebige Datentypen wie Zeichenfolgen, Zahlen, Objekte usw. enthalten kann.

 const weakSet = new WeakSet(); console.log(weakSet); // WeakSet () let obj = ( message: 'Hi', sendMessage: true ) // adding object (element) to WeakSet weakSet.add(obj); console.log(weakSet); // WeakSet ((message: "Hi", sendMessage: true))

Wenn Sie versuchen, neben Objekten noch andere Datentypen hinzuzufügen, gibt WeakSet einen Fehler aus. Beispielsweise,

 // trying to add string to WeakSet weakSet.add('hello'); // throws error // TypeError: Attempted to add a non-object key to a WeakSet console.log(weakSet);

WeakSet-Methoden

WeakSets haben Methoden add(), delete()und has(). Beispielsweise,

 const weakSet = new WeakSet(); console.log(weakSet); // WeakSet () const obj = (a:1); // add to a weakSet weakSet.add(obj); console.log(weakSet); // WeakSet ((a: 1)) // check if an element is in Set console.log(weakSet.has(obj)); // true // delete elements weakSet.delete(obj); console.log(weakSet); // WeakSet ()

WeakSets sind nicht iterierbar

Im Gegensatz zu Sets sind WeakSets nicht iterierbar. Beispielsweise,

 const weakSet = new WeakSet((a:1)); // looping through WeakSet for (let i of weakSet) ( // TypeError console.log(i); )

Mathematische Mengenoperationen

In JavaScript bietet Set keine integrierten Methoden zum Ausführen mathematischer Operationen wie Vereinigung, Schnittmenge, Differenz usw. Wir können jedoch Programme zum Ausführen dieser Operationen erstellen.

Beispiel: Union Operation einstellen

 // perform union operation // contain elements of both sets function union(a, b) ( let unionSet = new Set(a); for (let i of b) ( unionSet.add(i); ) return unionSet ) // two sets of fruits let setA = new Set(('apple', 'mango', 'orange')); let setB = new Set(('grapes', 'apple', 'banana')); let result = union(setA, setB); console.log(result);

Ausgabe

 Set ("Apfel", "Mango", "Orange", "Trauben", "Banane")

Beispiel: Schnittpunkt einstellen

 // perform intersection operation // elements of set a that are also in set b function intersection(setA, setB) ( let intersectionSet = new Set(); for (let i of setB) ( if (setA.has(i)) ( intersectionSet.add(i); ) ) return intersectionSet; ) // two sets of fruits let setA = new Set(('apple', 'mango', 'orange')); let setB = new Set(('grapes', 'apple', 'banana')); let result = intersection(setA, setB); console.log(result);

Ausgabe

 Set ("Apfel")

Beispiel: Differenzoperation einstellen

 // perform difference operation // elements of set a that are not in set b function difference(setA, setB) ( let differenceSet = new Set(setA) for (let i of setB) ( differenceSet.delete(i) ) return differenceSet ) // two sets of fruits let setA = new Set(('apple', 'mango', 'orange')); let setB = new Set(('grapes', 'apple', 'banana')); let result = difference(setA, setB); console.log(result);

Ausgabe

 Set ("Mango", "Orange")

Beispiel: Set Subset Operation

 // perform subset operation // true if all elements of set b is in set a function subset(setA, setB) ( for (let i of setB) ( if (!setA.has(i)) ( return false ) ) return true ) // two sets of fruits let setA = new Set(('apple', 'mango', 'orange')); let setB = new Set(('apple', 'orange')); let result = subset(setA, setB); console.log(result);

Ausgabe

 wahr

JavaScript Setsund WeakSetswurden in ES6 eingeführt . Einige Browser unterstützen ihre Verwendung möglicherweise nicht. Weitere Informationen finden Sie unter Unterstützung für JavaScript-Sets und Unterstützung für JavaScript-WeakSets.

Interessante Beiträge...