Wie konvertiere ich ein normales Objekt mit JavaScript in eine ES6-Karte?

Es gibt viele Möglichkeiten, gewöhnliche Objekte in JavaScript in ES6-Karten zu konvertieren. Der einfachste und effizienteste Weg ist die Verwendung der Funktion Object.entries() und des Konstruktors Map(). Im Gegensatz dazu umfassen flexiblere Alternativen Object.keys() und Array.prototype.forEach() sowie die Funktionsmethoden for...in-Schleife und Map() .

in ES6 ist eine Sammlung von Schlüssel-Wert-Paaren. Hier können wir jede Art von Objekt als Schlüssel verwenden, einschließlich primitiver Datentypen wie Zeichenfolgen und Zahlen. Die Werte in der Karte können Objekte jeglicher Art sein.

Der Hauptunterschied zwischen Map und Object besteht darin, dass die Schlüssel in Map einen beliebigen Datentyp haben können, während sie in Object immer in Zeichenfolgen konvertiert werden.

Dennoch haben Karten gegenüber normalen Objekten einige Vorteile, wie etwa Iterierbarkeit und garantierte Elementreihenfolge. In diesem Artikel wird erläutert, wie Sie mithilfe von JavaScript gewöhnliche Objekte in ES6-Karten konvertieren.

Methode 1: Verwenden Sie Object.entries() und Map()

Die erste Methode zum Konvertieren einer normalen Objekt-Intp-ES6-Zuordnung, die wir heute lernen werden, besteht aus zwei Schritten -

• Verwenden Sie die Methode Object.entries(), um ein Array von Schlüssel-Wert-Paaren von einem Objekt abzurufen

• Dann übergeben Sie dieses Array an den Map()-Konstruktor.

Beispiel

Jedes Array im von der Object.entries()-Methode zurückgegebenen Array stellt ein Schlüssel-Wert-Paar im Objekt dar. Hier ist ein Beispiel dafür, wie man ein normales Objekt mithilfe der Konstruktoren Object.entries() und Map() in eine ES6-Map ändert -

let plainObject = { "one": 1, "two": 2, "three": 3 };
let map = new Map(Object.entries(plainObject));
console.log(map); 

In diesem Beispiel verwenden Sie die Funktion Object.entries(), um ein normales Objekt in ein Array von Schlüssel-Wert-Paaren umzuwandeln. Dieses Array wird dann an die Funktion Map() übergeben, die mithilfe dieser Schlüssel-Wert-Paare ein neues Map-Objekt generiert.

Die Object.entries()-Methode erfordert nur eine Codezeile und wird von den meisten modernen Browsern vollständig unterstützt. Dieser Ansatz ist jedoch auf Objekte mit aufzählbaren Eigenschaften beschränkt und schließt Eigenschaften mit symbolischen Schlüsseln aus.

Methode 2: Verwenden Sie die for...in-Schleife und den Map()-Konstruktor

Sehen wir uns nun eine andere Möglichkeit an, ein normales Objekt in eine ES6-Karte umzuwandeln. Die Methode umfasst die folgenden Schritte

• Verwenden Sie eine for...in-Schleife, um die Eigenschaften eines Objekts zu durchlaufen

• Fügen Sie sie mithilfe der Map.set()-Methode zu einem neuen Map-Objekt hinzu.

Beispiel

Hier ist ein Beispiel dafür, wie man ein normales Objekt mit einer for...in-Schleife und dem Map()-Konstruktor in eine ES6-Map konvertiert -

let plainObject = { "one": 1, "two": 2, "three": 3 };
let map = new Map();
for (let key in plainObject) {
   map.set(key, plainObject[key]);
}
console.log(map); 

Bei dieser Methode durchlaufen wir eine Schleife und legen die Karteneigenschaften fest, wodurch diese Methode möglicherweise weniger effizient ist als die erste Methode.

Diese Methode funktioniert jedoch auch für Objekte mit nicht aufzählbaren Eigenschaften und Eigenschaften mit Symbolen als Schlüssel.

Methode 3: Verwenden Sie Object.keys() und Array.prototype.forEach()

Bei dieser Methode befolgen wir die unten angegebenen Schritte -

• Wir verwenden zunächst Object.keys(obj), um das Array der Objektschlüssel abzurufen.

• Dann verwenden wir die Methode Array.prototype.forEach(), um über die Schlüssel zu iterieren

• Dann verwenden wir die Methode Map.set(), um die Schlüssel-Wert-Paare zur Karte hinzuzufügen.

Beispiel

let plainObject = { "one": 1, "two": 2, "three": 3 };
let map = new Map();
Object.keys(plainObject).forEach(key => {
   map.set(key, plainObject[key]);
});
console.log(map);

Es ist wichtig, sich daran zu erinnern, dass die Methoden for...in-Schleife, Object.keys() und Array.prototype.forEach() alle Eigenschaftsobjekte in einer anderen Reihenfolge als der ursprünglichen Definition zurückgeben. Eigenschaften werden in der Aufzählungsreihenfolge zurückgegeben.

Die Map()-Funktionsmethode gibt jedoch die Schlüssel-Wert-Paare in der Reihenfolge zurück, in der sie übergeben werden.

Fazit

Abhängig von den spezifischen Anforderungen Ihres Projekts können Sie die Methode wählen, die Ihren Anforderungen am besten entspricht. Denken Sie daran, dass die Konstruktormethode Map() die beste Wahl ist, wenn die Reihenfolge in Ihrem Anwendungsfall wichtig ist. Andere Methoden funktionieren ansonsten einwandfrei.

Das obige ist der detaillierte Inhalt vonWie konvertiere ich ein normales Objekt mit JavaScript in eine ES6-Karte?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!