JavaScript Mapmetoder

new Map() metoden

kan oprettes ved at overføre en array til new Map() konstruktøren bruges til at oprette en Map:

instans

// Opretter en Map
const fruits = new Map([
  ["apples", 500],
  ["bananas", 300],
  ["oranges", 200]
]);

Prøv det selv

Map.get()

Man kan bruge get() metoden henter værdien for en nøgle i Map'en:

instans

fruits.get("apples");

Prøv det selv

Map.set()

Man kan bruge set() metoden tilføjer elementer til Map'en:

instans

// Opretter en Map
const fruits = new Map();
// Indstil Map-værdier
fruits.set("apples", 500);
fruits.set("bananas", 300);
fruits.set("oranges", 200);

Prøv det selv

set() metoden kan også bruges til at ændre eksisterende Map-værdier:

instans

fruits.set("apples", 500);

Prøv det selv

Map.size

size egenskaben returnerer antallet af elementer i Map'en:

instans

fruits.size;

Prøv det selv

Map.delete()

delete() metoden fjerner et element fra Map'en:

instans

fruits.delete("apples");

Prøv det selv

Map.clear()

clear() metoden fjerner alle elementer fra Map'en:

instans

fruits.clear();

Prøv det selv

Map.has()

hvis der findes en nøgle i Map'en:has() metoden returnerer true:

instans

fruits.has("apples");

Prøv det selv

Prøv følgende kode:

fruits.delete("apples");
fruits.has("apples");

Prøv det selv

Map.forEach()

forEach() metoden kaller en tilbagekaldelsesfunktion for hver nøgle-værdipar i Map'en:

instans

// 列出所有条目
let text = "";
fruits.forEach(function(value, key) {
  text += key + ' = ' + value;
});

Prøv det selv

Map.entries()

entries() metoden returnerer en iteratorobjekt, der indeholder Map'en [key, value] korrekt iteratorobjekt:

instans

// 列出所有条目
let text = "";
for (const x of fruits.entries()) {
  text += x;
}

Prøv det selv

Map.keys()

keys() metoden returnerer en iteratorobjekt, der indeholder nøglerne i Map'en:

instans

// 列出所有键
let text = "";
for (const x of fruits.keys()) {
  text += x;
}

Prøv det selv

Map.values()

values() metoden returnerer en iteratorobjekt, der indeholder værdierne i Map:

instans

// List alle værdier
let text = "";
for (const x of fruits.values()) {
  text += x;
}

Prøv det selv

Man kan bruge values() metoden summer værdierne i Map:

instans

// Summer alle værdier
let total = 0;
for (const x of fruits.values()) {
  total += x;
}

Prøv det selv

Objekter som nøgler

Tip:Kan bruge objekter som nøgler er en vigtig egenskab ved Map.

instans

// Opretter objekter
const apples = {name: 'Apples'};
const bananas = {name: 'Bananas'};
const oranges = {name: 'Oranges'};
// Opretter en Map
const fruits = new Map();
// Tilføjer nye elementer til Map
fruits.set(apples, 500);
fruits.set(bananas, 300);
fruits.set(oranges, 200);

Prøv det selv

Bemærk:nøglen er objektet (apples), ikke strengen ("apples"):

instans

fruits.get("apples"); // Returnerer undefined

Prøv det selv

JavaScript Map.groupBy()

ES2024 tilføjer til JavaScript Map.groupBy() metode.

Map.groupBy() metoden grupperer elementerne i objektet baseret på den strengværdi, som callback-funktionen returnerer.

Map.groupBy() metoden ændrer ikke det oprindelige objekt.

instans

// Opretter en array
const fruits = [
  {name: "apples", quantity: 300},
  {name: "bananas", quantity: 500},
  {name: "oranges", quantity: 200},
  {name: "kiwi", quantity: 150}
];
// Bruges som grupperingscallback
function myCallback({ quantity }) {
  return quantity > 200 ? "ok" : "low";
}
// Efter antal gruppering
const result = Map.groupBy(fruits, myCallback);

Prøv det selv

Browserv understøttelse

Map.groupBy() er en ES2024-funktion.

Fra marts 2024 vil nye browsere understøtte denne funktion:

Chrome Edge Firefox Safari Opera
Chrome 117 Edge 117 Firefox 119 Safari 17.4 Opera 103
September 2023 September 2023 Oktober 2023 Oktober 2024 Maj 2023

Advarsel:

ES2024-funktioner er relativt nye.

Gamle browsere kan kræve erstatningskode (Polyfill).

Forskellen mellem Object.groupBy() og Map.groupBy()

Object.groupBy() og Map.groupBy() Forskellen ligger i:

Object.groupBy() Gruppér elementer i JavaScript-objekter.

Map.groupBy() Gruppér elementer i Map-objekter.

Komplet Map referencehåndbog

For fuld reference, besøg vores:JavaScript Map referencehåndbog.

Denne håndbog indeholder beskrivelser og eksempler på alle Map-attributter og metoder.