Grundlegende Konzepte und allgemeine Methoden des Map-Mappings in ECMAScript6

Inhaltsverzeichnis

Was ist eine Zuordnung?
Unterschied zwischen Objekt und Karte
Allgemeine Methoden zuordnen

Deklarieren und initialisieren
Zuordnungssatz
Schlüsselwert abrufen
Schlüsselwert löschen delete
Bestimmen Sie, ob der Schlüsselwert vorhanden ist
Alle Schlüsselwerte abrufen()
Schlüssel/Wert-Iterator-Einträge()
Iteriere über alle Schlüsselwerte forEach(callback)
Löschen Sie alle Schlüsselwerte in Map clear()

Konvertierung in und aus anderen Datenstrukturen

Auf Array abbilden
Zuordnung zum Objekt zuordnen
Array zu Map
Objekt zur Karte
Karte zu JSON

Zusammenfassen

Map ist eine Datenstruktur, die in der ECMAScript 6-Spezifikation eingeführt wurde. Dies ist eine praktische Möglichkeit, Listen mit Schlüssel-Wert-Paaren zu speichern, ähnlich wie Wörterbücher oder Hash-Tabellen in anderen Programmiersprachen.

Was ist eine Zuordnung?

Javascript-Objekte sind im Wesentlichen Sammlungen von Schlüssel-Wert-Paaren (Hash-Strukturen), aber traditionell können nur Zeichenfolgen als Schlüssel verwendet werden, was ihre Verwendung stark einschränkt. Um dieses Problem zu lösen, wurde in ECMAScript 6 die Map-Datenstruktur eingeführt. Es ähnelt einem Objekt und ist ebenfalls eine Sammlung von Schlüssel-Wert-Paaren, allerdings ist der Umfang von „Schlüssel“ nicht auf Zeichenfolgen beschränkt, sondern alle Arten von Werten (einschließlich Objekte) können als Schlüssel verwendet werden. Mit anderen Worten bietet die Objektstruktur eine „String-Wert“-Entsprechung, während die Map-Struktur eine „Wert-Wert“-Entsprechung bietet, die eine vollständigere Implementierung der Hash-Struktur darstellt.

Schauen wir uns ein einfaches Beispiel an, um die grundlegende Verwendung von Map zu verstehen:

//Eine Karteninstanz deklarieren const page_info = new Map()
// Elemente zur Karte hinzufügen page_info.set("seo", {
    "Schlüsselwörter": "Entwicklerpunkt, Karte",
    "Beschreibung": "Das Map-Objekt ist eine einfache Schlüssel/Wert-Zuordnung, wobei die Schlüssel und Werte alles sein können (primitiv oder Objekt)."
})
page_info.set("Titel", "Javascript ES6-Karte")
console.log(Seiteninfo) 
console.log(Typ der Seiteninfo) // Objekt

Die Ausgabe ist:

Karte {
  'seo' => {
    Schlüsselwörter: "devpoint、Map",
    Beschreibung: „Das Map-Objekt ist eine einfache Schlüssel/Wert-Zuordnung, bei der die Schlüssel und Werte alles sein können (primitive oder Objektwerte)“
  },
  'Titel' => 'Kartenzuordnung von Javascript es6'
}
Objekt

Den Ausgabeergebnissen nach zu urteilen, ist Map im Wesentlichen ein Objekt.

Unterschied zwischen Objekt und Karte

Die Ähnlichkeiten zwischen Object und Map bestehen darin, dass beide einen Wert nach Schlüssel speichern und abrufen und Schlüssel gelöscht werden können. Es ist ersichtlich, dass die beiden sehr ähnlich sind. Der Unterschied besteht darin, dass:

Allgemeine Methoden zuordnen

Zu den häufig verwendeten Map-Methoden gehören: Zuweisen von set(key, value), Abrufen von get(key), Entfernen des angegebenen Schlüsselnamens und seines entsprechenden Werts delete(key), Prüfen, ob has(key) vorhanden ist, Abrufen aller Werte values(), Schlüssel/Wert-Iterator entries(), Durchlaufen von forEach() und Löschen aller Schlüssel/Wert-Paare clear() usw.

Deklarieren und initialisieren

const new_map = neue Map();
console.log(new_map); //Ausgabe: Map {}

Zuordnungssatz

Die Zuweisung verwendet map.set(Schlüssel,Wert), das zum Hinzufügen neuer Schlüssel-/Wertpaare oder zum Ändern von Schlüssel-/Wertpaaren und zur Rückgabe des gesamten Map-Objekts verwendet werden kann.

const page_info = neue Map()
// Setze den Wert page_info.set("seo", {
    "Schlüsselwörter": "Entwicklerpunkt, Karte",
    "Beschreibung": "Das Map-Objekt ist eine einfache Schlüssel/Wert-Zuordnung, wobei die Schlüssel und Werte alles sein können (primitiv oder Objekt)."
});
console.log(Seiteninfo);
page_info.set("seo", "seo-Informationen");
console.log(Seiteninfo);

Die obigen Beispiele erhöhen und ändern den Wert.

Karte {
  'seo' => {
    Schlüsselwörter: "devpoint、Map",
    Beschreibung: „Das Map-Objekt ist eine einfache Schlüssel/Wert-Zuordnung, bei der die Schlüssel und Werte alles sein können (primitive oder Objektwerte)“
  }
}
Karte { 'seo' => 'seo-Informationen' }

Schlüsselwert abrufen

Verwenden Sie get(key), um den Schlüsselwert abzurufen. Wenn der erhaltene Schlüssel->Wert nicht existiert, wird „undefiniert“ zurückgegeben.

const page_info = neue Karte();
page_info.set("Titel", "Javascript ES6-Kartenzuordnung");
const title = page_info.get("Titel");
const seo_info = page_info.get("seo");
console.log(Titel); //JavaScript ES6-Kartenmapping console.log(SEO_Info); //undefiniert

Schlüsselwert löschen delete

map.delete(key) löscht das Schlüssel-Wert-Paar des angegebenen Schlüssels und gibt ein Erfolgs- oder Fehlerergebnis zurück. Wenn die Löschung erfolgreich war, wird true zurückgegeben, andernfalls false.

const page_info = neue Karte();
page_info.set("Titel", "Javascript ES6-Kartenzuordnung");
page_info.set("Autor", "Entwicklerpunkt");
console.log(Seiteninfo); // Map { 'Titel' => 'Javascript ES6-Map-Mapping', 'Autor' => 'Entwicklerpunkt' }

const deleted_author = page_info.delete("Autor");
const deleted_seo = page_info.delete("seo");
console.log(gelöschter_Autor); // wahr
console.log(deleted_seo); // falsch
console.log(Seiteninfo); // Map { 'Titel' => 'Javascript ES6-Kartenmapping' }

Bestimmen Sie, ob der Schlüsselwert vorhanden ist

Verwenden Sie map.has(key), um zu überprüfen, ob der angegebene Schlüssel vorhanden ist.

const page_info = neue Karte();
page_info.set("Titel", "Javascript ES6-Kartenzuordnung");
console.log(Seiteninfo); // Map { 'Titel' => 'Javascript ES6-Kartenmapping' }

console.log(page_info.has("Titel")); // wahr
console.log(page_info.has("seo")); // falsch

Alle Schlüsselwerte abrufen()

const page_info = neue Karte();
page_info.set("Titel", "Javascript ES6-Kartenzuordnung");
page_info.set("Autor", "Entwicklerpunkt");
console.log(page_info.values()); // [Map-Iterator] { 'Javascript ES6-Map-Mapping', 'Devpoint' }

Schlüssel/Wert-Iterator Einträge ()

Verwenden Sie map.entries(), um einen Iterator zurückzugeben, der jedes [Schlüssel, Wert]-Array im Map-Objekt enthält.

const page_info = neue Karte();
page_info.set("Titel", "Javascript ES6-Kartenzuordnung");
page_info.set("Autor", "Entwicklerpunkt");
console.log(page_info.einträge());

Die Ausgabe ist:

[Karteneinträge] {
['Titel', 'Kartenzuordnung von Javascript es6'],
[ 'Autor', 'Entwicklerpunkt' ]
}

Iteriere über alle Schlüsselwerte forEach(callback)

const page_info = neue Karte();
page_info.set("Titel", "Javascript ES6-Kartenzuordnung");
page_info.set("Autor", "Entwicklerpunkt");
page_info.forEach((Wert,Schlüssel)=>{
    console.log(Schlüssel,Wert);
});

Die Ausgabe ist:

Titel Javascript ES6 Karte Mapping
Autor Devpoint

Löschen Sie alle Schlüsselwerte in Map clear()

Verwenden Sie map.clear(), um alle Schlüssel-Wert-Paare in der Map zu löschen.

const page_info = neue Karte();
page_info.set("Titel", "Javascript ES6-Kartenzuordnung");
page_info.set("Autor", "Entwicklerpunkt");
page_info.löschen();
console.log(Seiteninfo); // Karte {}

Konvertierung in und aus anderen Datenstrukturen

Auf Array abbilden

Die bequemste Möglichkeit, eine Map in ein Array umzuwandeln, ist die Verwendung des Spread-Operators ...

const page_info = neue Karte();
page_info.set("Titel", "Javascript ES6-Kartenzuordnung");
page_info.set("Autor", "Entwicklerpunkt");
console.log([...page_info]); // [ [ 'Titel', 'Javascript ES6-Map-Mapping' ], [ 'Autor', 'Entwicklerpunkt' ] ]

Zuordnung zum Objekt zuordnen

Funktion mapToObj(map) {
    const obj = Objekt.create(null);
    Karte.fürJeden((v,k)=>{
        Objekt[k] = v;
    });
    gibt Objekt zurück;
}
const page_info = neue Karte();
page_info.set("Titel", "Javascript ES6-Kartenzuordnung");
page_info.set("Autor", "Entwicklerpunkt");

console.log( mapToObj(page_info));

Die Ausgabe ist:

[Objekt: Null-Prototyp] {
Titel: 'Kartenmapping von Javascript es6',
Autor: „devpoint“
}

Array zu Map

Übergeben Sie das Array einfach an den Map-Konstruktor, also „new Map(array)“.

const Seiteninfo = [
    ["Titel","Kartenzuordnung von Javascript es6"],
    ["Autor","Entwicklerpunkt"]
];
console.log(neue Map(page_info)); // Map { 'Titel' => 'Javascript ES6 Map-Mapping', 'Autor' => 'Entwicklerpunkt' }

Objekt zur Karte

Objekte werden durch Object.entries() in Maps konvertiert.

const page_info = {
    Titel: „Kartenmapping von Javascript es6“,
    Autor: „Devpoint“
};
console.log(neue Map(Objekt.Einträge(Seiteninfo))); // Map { 'Titel' => 'Javascript ES6 Map-Mapping', 'Autor' => 'Entwicklerpunkt' }

Karte zu JSON

Um Map in JSON zu konvertieren, konvertieren Sie zuerst die Map in ein Objekt, z. B. mapToObj oben, und verwenden Sie dann die Methode JSON.stringify

Funktion mapToObj(map) {
    const obj = Objekt.create(null);
    Karte.fürJeden((v,k)=>{
        Objekt[k] = v;
    });
    gibt Objekt zurück;
}
Funktion mapToJson(map){
    gibt JSON.stringify(mapToObj(map)) zurück;
}
const page_info = neue Karte();
page_info.set("Titel", "Javascript ES6-Kartenzuordnung");
page_info.set("Autor", "Entwicklerpunkt");
console.log( mapToJson(page_info)); // {"Titel":"Javascript ES6-Kartenmapping","Autor":"Devpoint"}

Zusammenfassen

Damit ist dieser Artikel über die grundlegenden Konzepte und gängigen Methoden der Kartenzuordnung in ECMAScript6 abgeschlossen. Weitere relevante Inhalte zur Kartenzuordnung in ECMAScript6 finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, Sie werden 123WORDPRESS.COM auch in Zukunft unterstützen!

Das könnte Sie auch interessieren: