Detaillierte Erklärung der Set-Datenstruktur von JavaScript

Inhaltsverzeichnis

1. Was ist Set
2. Konstruktor festlegen

2.1) Arrays
2.2) Saiten
2.3) Argumente
2.4) Knotenliste
2.5) Satz

3. Legen Sie die Instanzeigenschaften und -methoden fest

4. Mitgliederzugang einrichten

5. Hinweise zum Set

6. Anwendungsfälle von Set

Zusammenfassen

1. Was ist Set

Man kann sich eine Menge einfach als eine mathematische Menge vorstellen.

Es handelt sich um eine ungeordnete Datensammlung ohne wiederholte Werte .

2. Konstruktor festlegen

Für die Parameter des Set-Konstruktors können folgende Formen übergeben werden.

2.1) Arrays

 Konstante s = neue Menge ([1, 2, 1]);
Konsole.log(s);

Bildbeschreibung hier einfügen

Hier wird als Parameter ein Array [1, 2, 1] übergeben. Da es sich bei Set um eine Sammlung nicht wiederkehrender Werte handelt, wird die dritte 1 automatisch gelöscht.

2.2) Saiten

 const s = new Set("Hallo Welt!");
Konsole.log(s);

Bildbeschreibung hier einfügen

2.3) Argumente

 Funktion Spaß() {
    const s = neues Set(Argumente);
    Konsole.log(s);
}

Spaß (1, 2, 3);

Bildbeschreibung hier einfügen

2.4) Knotenliste

 <!DOCTYPE html>
<html lang="de">
<Kopf>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-kompatibel" content="IE=edge">
    <meta name="viewport" content="width=Gerätebreite, Anfangsmaßstab=1.0">
    <Titel>festlegen</Titel>
</Kopf>
<Text>
    <p>1</p>
    <p>2</p>
    <p>3</p>
    
    <Skript>
        const s = neues Set(document.querySelectorAll('p'));
        Konsole.log(s);
    </Skript>
</body>
</html>

Bildbeschreibung hier einfügen

Hier werden Verweise auf drei p -Tags in Set s eingefügt;

Wenn wir es verwenden müssen, können wir dieses Set durchlaufen, dann jeweils die Referenzen der p Tags herausnehmen und dann p Tags ändern.

2.5) Satz

 const s1 = neues Set([1, 2, 3]);
const s2 = neues Set(s1);
konsole.log(s2);

Bildbeschreibung hier einfügen

Dies entspricht dem Kopieren von s1 und dem Übergeben an s2 , aber es handelt sich nicht um dasselbe Set

 Konsole.log(s1 === s2);

Bildbeschreibung hier einfügen

3. Legen Sie die Instanzeigenschaften und -methoden fest

Die Eigenschaften von Set haben ein Attribut size , das zum Speichern der Anzahl seiner Mitglieder verwendet wird.

 const s = neue Menge([1, 2, 3]);
Konsole.log(s.Größe);

Bildbeschreibung hier einfügen

Methoden des Sets

hinzufügen

Hinzufügen von Mitgliedern zu einem Set

 const s = neue Menge([1, 2, 3]);
// Sein Parameter kann nur einen übergeben s.add(5);
Konsole.log(s);
// kann mit add verkettet werden
s.add(7).add(9);
Konsole.log(s);

Bildbeschreibung hier einfügen

löschen

Wird zum Löschen von Mitgliedern aus einem Set verwendet

 const s = neue Menge([1, 2, 3]);
s.delete(2);
// Wenn das zu löschende Element nicht im Set gefunden wird, passiert nichts und es wird kein Fehler gemeldet s.delete(5);
Konsole.log(s);

Bildbeschreibung hier einfügen

Wird verwendet, um zu bestimmen, ob ein Set ein Mitglied enthält

 const s = neue Menge([1, 2, 3]);
console.log(s.hat(1));
console.log(s.has(5));

Bildbeschreibung hier einfügen

klar

Löscht alle Mitglieder des Sets

 const s = neue Menge([1, 2, 3]);
s.löschen();
Konsole.log(s);

Bildbeschreibung hier einfügen

4. Mitgliederzugang einrichten

Der Zugriff auf die Mitglieder wird über die Methode forEach implementiert, die das Set in der Reihenfolge durchläuft, in der die Mitglieder hinzugefügt wurden .

Es hat zwei Parameter, der erste Parameter ist die Rückruffunktion, und der zweite Parameter legt fest, worauf this in der Rückruffunktion zeigt, d. h.

 s.forEach(Rückruffunktion, Zeiger auf Rückruffunktion)

Schauen wir uns den ersten Parameter an:

Für die erste Parameter-Callback-Funktion gibt es drei Parameter:

 s.forEach(Funktion(Wert, Schlüssel, Satz){
	value ist ein Mitglied von Set. In Set sind value und key gleich. Set ist das vorherige Set selbst, d. h. hier set === s
});

Lassen Sie es uns anhand eines Beispiels verstehen:

 const s = neue Menge([1, 2, 3]);
s.forEach(Funktion(Wert, Schlüssel, Satz) {
    console.log(Wert, Schlüssel, Wert === Schlüssel);
    Konsole.log(setzen, setzen === s);
});

Bildbeschreibung hier einfügen

Schauen wir uns den zweiten Parameter an:

 const s = neue Menge([1, 2, 3]);
s.forEach(Funktion(Wert, Schlüssel, Satz) {
    konsole.log(dies);
}, dokumentieren);

Bildbeschreibung hier einfügen

5. Hinweise zum Set

Die Beurteilung doppelter Werte durch Set folgt grundsätzlich der strikten Gleichheit === Beurteilung

Für NaN ist NaN in Set jedoch gleich NaN

6. Anwendungsfälle von Set

Array-Deduplizierung

 sei arr = [1, 2, 1];
Konstante s = neues Set (arr);
arr = [...s];
// Sie können sie auch zu einem Satz kombinieren // arr = [...new Set(arr)];
Konsole.log(arr);

Bildbeschreibung hier einfügen

String-Deduplizierung

 lass str = "11231131242";
const s = neues Set(str);
str = [...s].join("");
// Kann auch als ein Satz geschrieben werden // str = [...new Set(str)].join("");
konsole.log(str);

Bildbeschreibung hier einfügen

Speichern von DOM-Elementen

 <!DOCTYPE html>
<html lang="de">
<Kopf>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-kompatibel" content="IE=edge">
    <meta name="viewport" content="width=Gerätebreite, Anfangsmaßstab=1.0">
    <Titel>festlegen</Titel>
</Kopf>
<Text>
    <p>1</p>
    <p>2</p>
    <p>3</p>
    
    <Skript>
        const s = neues Set(document.querySelectorAll('p'));
        s.fürEach((elem) => {
            console.log(Element)
        });
    </Skript>
</body>
</html>

Bildbeschreibung hier einfügen

Zusammenfassen

Dieser Artikel endet hier. Ich hoffe, er kann Ihnen helfen. Ich hoffe auch, dass Sie mehr Inhalt auf 123WORDPRESS.COM lesen können!

Das könnte Sie auch interessieren:

Detaillierte Erklärung von Wörterbuchbeispielen in JS-Algorithmen und Datenstrukturen
Erstellen einer JavaScript-Datenstruktursammlung (2)
Erstellen einer JavaScript-Datenstruktursammlung (1)
JavaScript-Datenstruktur: Erstellen einer Hash-Tabelle (1)
Konvertieren Sie die Datenstruktur der Go-Sprache in JSON
JS verwendet die Methode „reduce()“, um Baumstrukturdaten zu verarbeiten
So schreiben Sie ein Wörterbuch als JSON-Datei in Python
Python-Beispielcode zum Schreiben von Wörterbuchinhalten in eine JSON-Datei
Analyse der Fallstricke bei Python-Wörterbüchern und json.dumps()
Wörterbuchmethode für JavaScript-Datenstrukturen

<<: Drei Möglichkeiten, um einen Textblinkeffekt im CSS3-Beispielcode zu erzielen

>>: Detaillierte Erklärung des Unterschieds zwischen adaptiver und responsiver Analyse in der Umgangssprache

Einführung und Verwendung des JS-Beobachtermodus

Detaillierte Erklärung der Set-Datenstruktur von JavaScript

Inhaltsverzeichnis

1. Was ist Set

2. Konstruktor festlegen

2.1) Arrays

2.2) Saiten

2.3) Argumente

2.4) Knotenliste

2.5) Satz

3. Legen Sie die Instanzeigenschaften und -methoden fest

4. Mitgliederzugang einrichten

5. Hinweise zum Set

6. Anwendungsfälle von Set

Zusammenfassen

Einführung und Verwendung des JS-Beobachtermodus

Lassen Sie uns über die Speicher-Engine in MySQL sprechen

Grafisches Tutorial zur Installation und Konfiguration von MySQL 8.0.20 winx64

SQL zur Implementierung der Wiederherstellung einer Zeitreihenversetzung

Docker Compose Idea CreateProcess-Fehler = 2 Das System kann die angegebene Datei nicht finden

So stellen Sie eine Verbindung zum MySQL-Visualisierungstool Navicat her

Webdesign-Erfahrung: 5 hervorragende Webdesign-Konzepte, vollständige Analyse (Bilder)

Eine kurze Diskussion zum Verständnis von TypeScript-Indexsignaturen

Wie InnoDB die Serialisierungsisolationsebene implementiert

So installieren und konfigurieren Sie Docker nginx

Artikel empfehlen

Einfaches Tutorial zur Verwendung von Navicat für MySQL

Skin-Change-Lösung basierend auf Vue kombiniert mit ElementUI

Zwei Möglichkeiten zum vollständigen Löschen von Benutzern unter Linux

Grafisches Tutorial zur Installations- und Konfigurationsmethode von Mysql5.7.14 (Lösung für Passwortprobleme)

JavaScript zum Erzielen eines benutzerdefinierten Bildlaufleisteneffekts

MySQL-Installations- und Konfigurationsmethoden und Vorsichtsmaßnahmen unter der Windows-Plattform

Der umfassendste und detaillierteste Prozess zur Installation von Deepin20 auf einer virtuellen VMware-Maschine

Detaillierte Analyse klassischer Fragen zu JavaScript-Rekursionsfällen

XHTML drei Dokumenttypdeklarationen

So richten Sie eine VSCode-Remoteverbindung zum Server-Docker-Container ein

Tutorial zur HTML-Tabellenauszeichnung (37): Hintergrundbild-Attribut BACKGROUND

So binden Sie einen Docker-Container an eine externe IP und einen externen Port

Eine kurze Diskussion über die Effizienz der MySQL-Unterabfrage-Vereinigung und in

Grundlegende Fähigkeiten zum Entwerfen von Web-Frontend-Schnittstellen

Detaillierte Verwendung des Vue More Filter-Widgets