• Erledigen Sie die Anwendungssicherheit auf die richtige Weise! Erkennen, schützen, überwachen, beschleunigen und mehr…
  • Sets sind ein neues Add-On zu JavaScript in ES6. Lass es uns lernen.

    Was sind die Sets?

    Wie verwende ich sie in JavaScript?

    Und welche Methoden bieten sich an, um Probleme zu lösen?

    Lassen Sie uns die Antworten auf alle Fragen in diesem Tutorial herausfinden.

    Sets

    Wie der Name schon sagt, ist eine Menge eine Sammlung eindeutiger Elemente. Die wiederholten Werte werden nicht gespeichert.

    Sets in JavaScript speichern die Elemente in der Einfügereihenfolge. Sie sind also in JavaScript geordnet. Und es werden primitive Datentypen oder Objekte gespeichert.

    Sehen wir uns die Syntax der Mengen in JavaScript an.

    Ich hoffe du hast IDE Folgendes üben.

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

    Eigenschaften und Methoden

    Sets haben unterschiedliche Eigenschaften und Methoden, mit denen wir verschiedene Probleme lösen können. Die Eigenschaften und Methoden sind so einfach wie das Erstellen. Sie können die Funktionalität der Methoden leicht mit ihren Namen selbst abrufen. Lassen Sie uns sie eins nach dem anderen sehen.

    Größe

    Das Anwesen size Gibt die Anzahl der in der Menge vorhandenen Elemente zurück.

    const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);
    console.log(`Size: ${names.size}`);
    

    hinzufügen

    Das Verfahren add wird verwendet, um der Menge ein neues Element hinzuzufügen. Wenn das neue Element bereits im Set vorhanden ist, wird es nicht hinzugefügt.

    // empty set
    const names = new Set();
    
    names.add("John");
    names.add("Harry");
    names.add("Wick");
    names.add("Jack");
    names.add("Harry");
    
    console.log(names);
    

    hat

    Das Verfahren has nimmt ein Argument und kehrt zurück true Wenn das Element in der Menge vorhanden ist, wird es zurückgegeben false.

    const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);
    
    console.log(names.has("Harry"));
    console.log(names.has("Alley"));
    

    löschen

    Wie Sie die Methode erwarten delete nimmt ein Argument und löscht es aus der Menge. Es wird kein Fehler ausgegeben, auch wenn das angegebene Argument nicht in der Menge vorhanden ist.

    const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);
    
    names.delete("John");
    
    console.log(names);
    

    Einträge

    Das Verfahren entries Gibt einen Iterator zurück, der Arrays von Schlüssel-Wert-Paaren in der Einfügereihenfolge enthält. Hier sind Schlüssel und Wert gleich.

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

    Tasten

    Das Verfahren keys Gibt einen Iterator von Set-Elementen in der Einfügereihenfolge zurück.

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

    Werte

    Das Verfahren values Gibt einen Iterator von Set-Elementen in der Einfügereihenfolge zurück, der der Methode ähnelt 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

    Das Verfahren clear Entfernt alle Elemente aus dem Set.

    const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);
    
    names.clear();
    
    console.log(names);
    

    für jeden

    Das Verfahren forEach wird verwendet, um die Menge zu durchlaufen und alle Elemente einzeln abzurufen.

    const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);
    
    names.forEach((element) => {
       console.log(element);
    });
    

    Sonstiges

    Sehen wir uns eine einfache Anwendung von Mengen mit einem Programm an. Entfernen Sie bei einem gegebenen Array alle doppelten Werte daraus. Um das Problem zu lösen, können wir die set-Eigenschaft verwenden.

    Lassen Sie uns den Schritt sehen, um es zu lösen.

    • Initialisieren Sie ein Array mit Dummy-Daten.
    • Initialisieren Sie einen leeren Satz.
    • Iterieren Sie über das Array von Elementen.
      • Fügen Sie jedes Element zur Menge hinzu.
      • Doppelte Elemente werden automatisch entfernt.
    • Initialisieren Sie ein leeres Array.
    • Durchlaufen Sie die Menge und fügen Sie jedes Element dem neuen Array hinzu.
    • Drucken Sie das neue Array.

    Ich hoffe du kannst es selbst lösen. Wenn Sie Schwierigkeiten beim Codieren haben, sehen Sie sich die folgende Lösung an.

    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

    Jetzt haben Sie alle Kenntnisse, die Sie benötigen, um mit Sets zu arbeiten JavaScript. Sie können sie in Ihrem nächsten Projekt verwenden. Machen Sie weiter und nutzen Sie jedes bisschen davon.

    Viel Spaß beim Codieren 👨‍💻