Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten.Erfahre mehr über dieses Experiment.
Map
Baseline Widely available *
This feature is well established and works across many devices and browser versions. It’s been available across browsers since Juli 2015.
* Some parts of this feature may have varying levels of support.
DasMap-Objekt hält Schlüssel-Wert-Paare und merkt sich die ursprüngliche Einfügereihenfolge der Schlüssel. Jeder Wert (sowohl Objekte als auchprimitive Werte) kann sowohl als Schlüssel als auch als Wert verwendet werden.
In diesem Artikel
Probieren Sie es aus
const map = new Map();map.set("a", 1);map.set("b", 2);map.set("c", 3);console.log(map.get("a"));// Expected output: 1map.set("a", 97);console.log(map.get("a"));// Expected output: 97console.log(map.size);// Expected output: 3map.delete("b");console.log(map.size);// Expected output: 2Beschreibung
Map-Objekte sind Sammlungen von Schlüssel-Wert-Paaren. Ein Schlüssel in derMapkann nur einmal vorkommen; er ist einzigartig in der Sammlung derMap. EinMap-Objekt wird durch Schlüssel-Wert-Paare iteriert — einefor...of Schleife gibt ein Array mit zwei Elementen[key, value] für jede Iteration zurück. Die Iteration erfolgt inEinfügereihenfolge, was der Reihenfolge entspricht, in der jedes Schlüssel-Wert-Paar erstmals mittels derset()-Methode in die Karte eingefügt wurde (das heißt, es gab keinen Schlüssel mit demselben Wert, alsset() aufgerufen wurde).
Die Spezifikation erfordert, dass Maps so implementiert werden, dass sie im Durchschnitt Zugriffszeiten bieten, die sublinear zur Anzahl der Elemente in der Sammlung sind. Daher könnte sie intern als Hash-Tabelle (mit O(1) Suchzeit), Suchbaum (mit O(log(N)) Suchzeit) oder einer anderen Datenstruktur dargestellt werden, solange die Komplexität besser als O(N) ist.
Schlüsselgleichheit
Die Gleichheit der Werte basiert auf demSameValueZero-Algorithmus. (Früher wurdeSameValue verwendet, das0 und-0 als unterschiedlich behandelte. Prüfen Sie dieBrowser-Kompatibilität.) Das bedeutet, dassNaN als gleichNaN angesehen wird (obwohlNaN !== NaN) und alle anderen Werte als gleich gemäß den Semantiken des=== Operators betrachtet werden. Bei Objektschlüsseln basiert die Gleichheit auf der Objektidentität. Sie werden durch Referenz verglichen, nicht durch Wert. SieheVerwendung des Map-Objekts für Beispiele.
Objekte vs. Maps
Object ist ähnlich wieMap — beide erlauben das Setzen von Schlüsseln zu Werten, das Abrufen dieser Werte, das Löschen von Schlüsseln und das Erkennen, ob etwas unter einem Schlüssel gespeichert ist. Aus diesem Grund (und da es keine eingebauten Alternativen gab) wurdeObject historisch alsMap verwendet.
Es gibt jedoch wichtige Unterschiede, dieMap in einigen Fällen bevorzugt machen:
| Map | Object | |
|---|---|---|
| Zufällige Schlüssel | EineMap enthält standardmäßig keine Schlüssel. Sie enthält nur das, was explizit hineingesteckt wird. | Ein Hinweis: Dies kann umgangen werden, indem |
| Sicherheit | EineMap ist sicher für die Verwendung mit benutzerdefinierten Schlüsseln und Werten. | Das Setzen von benutzerdefinierten Schlüssel-Wert-Paaren auf einem |
| Schlüsseltypen | Die Schlüssel einerMap können beliebige Werte sein (einschließlich Funktionen, Objekte oder beliebige Primitive). | Die Schlüssel einesObject müssen entweder einString oder einSymbol sein. |
| Schlüsselreihenfolge | Die Schlüssel in | Obwohl die Schlüssel eines gewöhnlichen Die Reihenfolge wurde erstmals für eigene Eigenschaften in ECMAScript 2015 definiert; ECMAScript 2020 definiert die Reihenfolge auch für geerbte Eigenschaften. Beachten Sie jedoch, dass kein einziger Mechanismusalle Eigenschaften eines Objekts iteriert; die verschiedenen Mechanismen beinhalten jeweils unterschiedliche Teilmengen von Eigenschaften. ( |
Größe | Die Anzahl der Elemente in einerMap lässt sich einfach über ihresize-Eigenschaft abrufen. | Die Bestimmung der Anzahl der Elemente in einemObject ist umständlicher und weniger effizient. Eine gängige Methode ist die Nutzung derlength des vonObject.keys() zurückgegebenen Arrays. |
| Iteration | EineMap ist iterierbar, so dass sie direkt iteriert werden kann. |
Hinweis:
|
| Leistung | Bessere Leistung in Szenarien mit häufigem Hinzufügen und Entfernen von Schlüssel-Wert-Paaren. | Nicht für häufiges Hinzufügen und Entfernen von Schlüssel-Wert-Paaren optimiert. |
| Serialisierung und Parsing | Keine native Unterstützung für Serialisierung oder Parsing. (Aber Sie können Ihre eigene Serialisierung und Parsing-Unterstützung für | Nativer Support für die Serialisierung von Nativer Support für das Parsing von JSON zu |
Setzen von Objekt-Eigenschaften
Das Setzen von Objekt-Eigenschaften funktioniert auch bei Map-Objekten und kann erhebliche Verwirrung verursachen.
Daher scheint es auf diese Weise zu funktionieren:
const wrongMap = new Map();wrongMap["bla"] = "blaa";wrongMap["bla2"] = "blaaa2";console.log(wrongMap); // Map { bla: 'blaa', bla2: 'blaaa2' }Aber diese Art, eine Eigenschaft zu setzen, interagiert nicht mit der Map-Datenstruktur. Es nutzt die Funktion des generischen Objekts. Der Wert von 'bla' wird nicht in der Map für Abfragen gespeichert. Andere Operationen auf den Daten schlagen fehl:
wrongMap.has("bla"); // falsewrongMap.delete("bla"); // falseconsole.log(wrongMap); // Map { bla: 'blaa', bla2: 'blaaa2' }Die korrekte Verwendung zum Speichern von Daten in der Map erfolgt über dieset(key, value)-Methode.
const contacts = new Map();contacts.set("Jessie", { phone: "213-555-1234", address: "123 N 1st Ave" });contacts.has("Jessie"); // truecontacts.get("Hilary"); // undefinedcontacts.set("Hilary", { phone: "617-555-4321", address: "321 S 2nd St" });contacts.get("Jessie"); // {phone: "213-555-1234", address: "123 N 1st Ave"}contacts.delete("Raymond"); // falsecontacts.delete("Jessie"); // trueconsole.log(contacts.size); // 1Kartenähnliche Browser-APIs
BrowserMap-ähnliche Objekte (oder "kartenähnliche Objekte") sindWeb-API-Schnittstellen, die sich in vielerlei Hinsicht wie eineMap verhalten.
Genau wieMap können die Einträge in derselben Reihenfolge iteriert werden, in der sie dem Objekt hinzugefügt wurden.Map-ähnliche Objekte undMap haben auch Eigenschaften und Methoden, die denselben Namen und das gleiche Verhalten teilen. Anders als beiMap erlauben sie jedoch nur bestimmte vordefinierte Typen für die Schlüssel und Werte jedes Eintrags.
Die erlaubten Typen sind in der Spezifikation-IDL-Definition festgelegt. Beispielsweise istRTCStatsReport einMap-ähnliches Objekt, das Strings für Schlüssel und Objekte für Werte verwenden muss. Dies ist in der Spezifikation-IDL unten definiert:
interface RTCStatsReport { readonly maplike<DOMString, object>;};Map-ähnliche Objekte sind entweder schreibgeschützt oder schreibbar (siehe dasreadonly Schlüsselwort in der obigen IDL).
- Schreibgeschützte
Map-ähnliche Objekte haben die Eigenschaftsizeund die Methoden:entries(),forEach(),get(),has(),keys(),values(), undSymbol.iterator(). - Schreibbare
Map-ähnliche Objekte haben zusätzlich die Methoden:clear(),delete(), undset().
Die Methoden und Eigenschaften haben das gleiche Verhalten wie die gleichwertigen Entitäten inMap, abgesehen von der Einschränkung der Typen der Schlüssel und Werte.
Die folgenden sind Beispiele für schreibgeschützteMap-ähnliche Browser-Objekte:
Konstruktor
Map()Erstellt ein neues
Map-Objekt.
Statische Eigenschaften
Map[Symbol.species]Die Konstruktionsfunktion, die verwendet wird, um abgeleitete Objekte zu erstellen.
Statische Methoden
Map.groupBy()Gruppiert die Elemente eines gegebenen Iterables unter Verwendung der von einer bereitgestellten Callback-Funktion zurückgegebenen Werte. Die endgültige zurückgegebene
Mapverwendet die eindeutigen Werte der Testfunktion als Schlüssel, die verwendet werden können, um das Array von Elementen in jeder Gruppe zu erhalten.
Instanz-Eigenschaften
Diese Eigenschaften sind aufMap.prototype definiert und werden von allenMap-Instanzen geteilt.
Map.prototype.constructorDie Konstruktionsfunktion, die das Instanzobjekt erstellt hat. Bei
Map-Instanzen ist der Anfangswert derMap-Konstruktor.Map.prototype.sizeGibt die Anzahl der Schlüssel-/Wert-Paare im
Map-Objekt zurück.Map.prototype[Symbol.toStringTag]Der Anfangswert der
[Symbol.toStringTag]-Eigenschaft ist der String"Map". Diese Eigenschaft wird inObject.prototype.toString()verwendet.
Instanz-Methoden
Map.prototype.clear()Entfernt alle Schlüssel-Wert-Paare aus dem
Map-Objekt.Map.prototype.delete()Entfernt den durch den Schlüssel angegebenen Eintrag aus dieser
Map.Map.prototype.entries()Gibt ein neues Iterator-Objekt zurück, das ein Zwei-Elemente-Array von
[key, value]für jedes Element imMap-Objekt in Einfügereihenfolge enthält.Map.prototype.forEach()Ruft
callbackFneinmal für jedes imMap-Objekt vorhandene Schlüssel-Wert-Paar in Einfügereihenfolge auf. Wenn einthisArg-Parameter anforEachübergeben wird, wird er als diesethis-Wert für jeden Callback verwendet.Map.prototype.get()Gibt den Wert zurück, der dem Schlüssel in dieser
Mapentspricht, oderundefined, wenn keiner vorhanden ist.Map.prototype.getOrInsert()Gibt den Wert zurück, der dem angegebenen Schlüssel in dieser
Mapentspricht. Wenn der Schlüssel nicht vorhanden ist, wird ein neuer Eintrag mit dem Schlüssel und einem gegebenen Standardwert eingefügt und der eingefügte Wert zurückgegeben.Map.prototype.getOrInsertComputed()Gibt den Wert zurück, der dem angegebenen Schlüssel in dieser
Mapentspricht. Wenn der Schlüssel nicht vorhanden ist, wird ein neuer Eintrag mit dem Schlüssel und einem Standardwert eingefügt, der aus einem gegebenen Callback berechnet wird, und der eingefügte Wert wird zurückgegeben.Map.prototype.has()Gibt einen booleanischen Wert zurück, der angibt, ob ein Eintrag mit dem angegebenen Schlüssel in dieser
Mapexistiert oder nicht.Map.prototype.keys()Gibt ein neues Iterator-Objekt zurück, das die Schlüssel für jedes Element im
Map-Objekt in Einfügereihenfolge enthält.Map.prototype.set()Fügt dieser
Mapeinen neuen Eintrag mit einem angegebenen Schlüssel und Wert hinzu oder aktualisiert einen vorhandenen Eintrag, wenn der Schlüssel bereits existiert.Map.prototype.values()Gibt ein neues Iterator-Objekt zurück, das die Werte für jedes Element im
Map-Objekt in Einfügereihenfolge enthält.Map.prototype[Symbol.iterator]()Gibt ein neues Iterator-Objekt zurück, das ein Zwei-Elemente-Array von
[key, value]für jedes Element imMap-Objekt in Einfügereihenfolge enthält.
Beispiele
>Verwendung des Map-Objekts
const myMap = new Map();const keyString = "a string";const keyObj = {};const keyFunc = () => {};// setting the valuesmyMap.set(keyString, "value associated with 'a string'");myMap.set(keyObj, "value associated with keyObj");myMap.set(keyFunc, "value associated with keyFunc");console.log(myMap.size); // 3// getting the valuesconsole.log(myMap.get(keyString)); // "value associated with 'a string'"console.log(myMap.get(keyObj)); // "value associated with keyObj"console.log(myMap.get(keyFunc)); // "value associated with keyFunc"console.log(myMap.get("a string")); // "value associated with 'a string'", because keyString === 'a string'console.log(myMap.get({})); // undefined, because keyObj !== {}console.log(myMap.get(() => {})); // undefined, because keyFunc !== () => {}Verwendung von NaN als Map-Schlüssel
NaN kann ebenfalls als Schlüssel verwendet werden. Obwohl jedesNaN nicht gleich sich selbst ist (NaN !== NaN ist wahr), funktioniert das folgende Beispiel, daNaNs nicht voneinander zu unterscheiden sind:
const myMap = new Map();myMap.set(NaN, "not a number");myMap.get(NaN);// "not a number"const otherNaN = Number("foo");myMap.get(otherNaN);// "not a number"Iteration der Map mit for...of
Maps können mit einerfor...of Schleife iteriert werden:
const myMap = new Map();myMap.set(0, "zero");myMap.set(1, "one");for (const [key, value] of myMap) { console.log(`${key} = ${value}`);}// 0 = zero// 1 = onefor (const key of myMap.keys()) { console.log(key);}// 0// 1for (const value of myMap.values()) { console.log(value);}// zero// onefor (const [key, value] of myMap.entries()) { console.log(`${key} = ${value}`);}// 0 = zero// 1 = oneIteration der Map mit forEach()
Maps können mit derforEach()-Methode iteriert werden:
myMap.forEach((value, key) => { console.log(`${key} = ${value}`);});// 0 = zero// 1 = oneBeziehung zu Array-Objekten
const kvArray = [ ["key1", "value1"], ["key2", "value2"],];// Use the regular Map constructor to transform a 2D key-value Array into a mapconst myMap = new Map(kvArray);console.log(myMap.get("key1")); // "value1"// Use Array.from() to transform a map into a 2D key-value Arrayconsole.log(Array.from(myMap)); // Will show you exactly the same Array as kvArray// A succinct way to do the same, using the spread syntaxconsole.log([...myMap]);// Or use the keys() or values() iterators, and convert them to an arrayconsole.log(Array.from(myMap.keys())); // ["key1", "key2"]Klonen und Zusammenführen von Maps
Genauso wieArrays könnenMaps geklont werden:
const original = new Map([[1, "one"]]);const clone = new Map(original);console.log(clone.get(1)); // oneconsole.log(original === clone); // false (useful for shallow comparison)Hinweis:Beachten Sie, dassdie Daten selbst nicht geklont werden. Mit anderen Worten, es handelt sich nur um eineflache Kopie derMap.
Maps können zusammengeführt werden, wobei die Eindeutigkeit der Schlüssel beibehalten wird:
const first = new Map([ [1, "one"], [2, "two"], [3, "three"],]);const second = new Map([ [1, "uno"], [2, "dos"],]);// Merge two maps. The last repeated key wins.// Spread syntax essentially converts a Map to an Arrayconst merged = new Map([...first, ...second]);console.log(merged.get(1)); // unoconsole.log(merged.get(2)); // dosconsole.log(merged.get(3)); // threeMaps können auch mit Arrays zusammengeführt werden:
const first = new Map([ [1, "one"], [2, "two"], [3, "three"],]);const second = new Map([ [1, "uno"], [2, "dos"],]);// Merge maps with an array. The last repeated key wins.const merged = new Map([...first, ...second, [1, "un"]]);console.log(merged.get(1)); // unconsole.log(merged.get(2)); // dosconsole.log(merged.get(3)); // threeSpezifikationen
| Specification |
|---|
| ECMAScript® 2026 Language Specification> # sec-map-objects> |