EMZETT.
Login

Emzett Wiki

JavaScript: Map, Set und WeakMap

Properties1
tagsprogrammiersprachen, javascript

3 Min. Lesezeit

Kurz: Neben Arrays und Objekten kennt JavaScript zwei weitere Sammlungen: Map (Schlüssel → Wert) und Set (Menge ohne Duplikate).

Teil des Kurses JavaScript

Kapitel 17 von 40 im Kurs JavaScript. Mit Fortschritt, Quiz und Zertifikat auf der Lernseite.

Neben Arrays und Objekten kennt JavaScript zwei weitere Sammlungen: Map (Schlüssel → Wert) und Set (Menge ohne Duplikate).

Set

Ein Set speichert jeden Wert höchstens einmal:

const s = new Set([1, 2, 2, 3, 3, 3]);
console.log(s, s.size);
s.add(4); s.add(2);
console.log(s.has(4), s.has(9));
s.delete(1);
console.log([...s]);
console.log([...new Set("mississippi")].join(""));

Ausgabe:

Set(3) { 1, 2, 3 } 3
true false
[ 2, 3, 4 ]
misp

Mengenoperationen

const a = new Set([1, 2, 3, 4]), b = new Set([3, 4, 5]);
console.log([...a].filter(x => b.has(x)));        // Schnittmenge
console.log([...new Set([...a, ...b])]);          // Vereinigung
console.log([...a].filter(x => !b.has(x)));       // Differenz

Ausgabe:

[ 3, 4 ]
[ 1, 2, 3, 4, 5 ]
[ 1, 2 ]

Map

Eine Map speichert Schlüssel-Wert-Paare. Anders als bei Objekten darf jeder Wert Schlüssel sein (Zahlen, Objekte, Funktionen) und die Einfügereihenfolge bleibt erhalten:

const m = new Map();
m.set("a", 1).set(2, "zwei").set(true, "ja");
console.log(m.get("a"), m.get(2), m.get(true), m.get("x"));
console.log(m.size, m.has(2));
m.delete(2);
for (const [k, v] of m) console.log(k, "->", v);
console.log([...m.keys()], [...m.values()]);
const m2 = new Map([["x", 10], ["y", 20]]);
console.log(Object.fromEntries(m2), new Map(Object.entries({ a: 1 })));

Ausgabe:

1 zwei ja undefined
3 true
a -> 1
true -> ja
[ 'a', true ] [ 1, 'ja' ]
{ x: 10, y: 20 } Map(1) { 'a' => 1 }

Map oder Objekt?

ObjektMap
SchlüsseltypenText und Symbolebeliebig
Reihenfolgemeist Einfügereihenfolgegarantiert Einfügereihenfolge
Größemanuell (Object.keys(o).length).size
Häufiges Hinzufügen/Löschenlangsameroptimiert
JSONdirektUmwandlung nötig

Für feste Datensätze ({ name, alter }) nimmst du Objekte, für dynamische Tabellen oder Zähler eine Map.

Zähler mit Map

const text = "das ist ein test das ist gut";
const zaehler = new Map();
for (const wort of text.split(" ")) zaehler.set(wort, (zaehler.get(wort) ?? 0) + 1);
console.log([...zaehler].sort((a, b) => b[1] - a[1]).slice(0, 2));
console.log(Map.groupBy([1, 2, 3, 4], n => n % 2 ? "ungerade" : "gerade"));

Ausgabe:

[ [ 'das', 2 ], [ 'ist', 2 ] ]
Map(2) { 'ungerade' => [ 1, 3 ], 'gerade' => [ 2, 4 ] }

Objekte als Schlüssel

const schluessel = { id: 1 };
const m = new Map([[schluessel, "Daten"]]);
console.log(m.get(schluessel), m.get({ id: 1 }));   // zweites Objekt ist ein anderes

Ausgabe:

Daten undefined

WeakMap und WeakSet

WeakMap und WeakSet halten Objekte nur schwach: Wird das Objekt sonst nirgends benutzt, räumt der Speicher-Aufräumer es weg. Sie eignen sich für Zusatzdaten zu Objekten, ohne Speicherlecks zu verursachen. Man kann sie nicht durchlaufen.

const privat = new WeakMap();
class Konto {
  constructor(stand) { privat.set(this, { stand }); }
  get stand() { return privat.get(this).stand; }
}
console.log(new Konto(100).stand);

Ausgabe:

100

Merke

  • Set: Menge ohne Duplikate (add, has, delete, size)
  • Map: Schlüssel-Wert mit beliebigen Schlüsseln, behält die Reihenfolge
  • Duplikate entfernen: [...new Set(array)]
  • WeakMap/WeakSet: schwache Verweise ohne Speicherlecks
  • Mit Maps kannst du Zähler und Gruppierungen sauber bauen

Übungsaufgabe

Entferne Duplikate aus [3, 1, 3, 2, 1] mit einem Set und zähle, wie oft jedes Zeichen in “banane” vorkommt, mit einer Map.

Quiz zur Selbstkontrolle

)?

  • 2 (richtig)
  • 3
  • 1
  • 0

Weiter im Kurs

Zurück: Destructuring, Spread und Rest

Weiter: JSON

Alle Kapitel: JavaScript im Überblick

Graphansicht

Backlinks