Map, Set, WeakMap & WeakSet
Map and Set are modern data structures from ES6. Map stores key-value pairs (any key type, unlike objects). Set stores unique values only. WeakMap/WeakSet allow garbage collection of keys.
Map & Set
- Map — Key-value pairs. Any type as key (objects, numbers, functions). Ordered by insertion
- Set — Unique values only. No duplicates. Great for deduplication
- Map vs Object — Map: any key, ordered, .size property, iterable. Object: string/symbol keys only
- Set vs Array — Set: unique values, .has() is O(1). Array: allows duplicates, .includes() is O(n)
- WeakMap — Keys must be objects. Allows garbage collection when key is no longer referenced
- WeakSet — Values must be objects. Also allows garbage collection
Map & Set Code
// Map — any key type, ordered
const userRoles = new Map();
userRoles.set("Alice", "admin");
userRoles.set("Bob", "user");
userRoles.set(42, "system"); // number key!
console.log(userRoles.get("Alice")); // "admin"
console.log(userRoles.has("Bob")); // true
console.log(userRoles.size); // 3
// Iterate Map
for (const [key, value] of userRoles) {
console.log(`${key} → ${value}`);
}
// Object as key (impossible with regular objects!)
const user = { name: "Alice" };
const metadata = new Map();
metadata.set(user, { lastLogin: new Date(), visits: 42 });
console.log(metadata.get(user)); // { lastLogin: ..., visits: 42 }
// Set — unique values only
const nums = new Set([1, 2, 3, 2, 1, 4, 3, 5]);
console.log(nums); // Set { 1, 2, 3, 4, 5 } — no duplicates!
console.log(nums.size); // 5
nums.add(6);
nums.delete(1);
console.log(nums.has(3)); // true
// Deduplicate array
const arr = [1, 2, 2, 3, 3, 3, 4];
const unique = [...new Set(arr)];
console.log(unique); // [1, 2, 3, 4]
// Real-world: track unique visitors
const visitors = new Set();
visitors.add("user_123");
visitors.add("user_456");
visitors.add("user_123"); // duplicate — ignored
console.log(`Unique visitors: ${visitors.size}`); // 2Tip
Tip
Use Set for fast existence checks (has() is O(1)) and Map for key-value pairs where keys can be any type. Convert between arrays and Sets freely: [...new Set(array)] removes duplicates in one line.
Map/Set for general use. Weak variants for memory-sensitive caching.
Common Mistake
Warning
Using objects as Map keys without understanding reference equality. Two different objects with identical properties are different keys. const a = {x:1}; const b = {x:1}; map.set(a, 1); map.get(b) returns undefined because a !== b.
Practice Task
Note
Set and Map practice: (1) Remove duplicates from an array using Set. (2) Create a word frequency counter using Map. (3) Use WeakMap to store private data associated with DOM elements.
Quick Quiz
Key Takeaways
- Map and Set are modern data structures from ES6.
- Map — Key-value pairs. Any type as key (objects, numbers, functions). Ordered by insertion
- Set — Unique values only. No duplicates. Great for deduplication
- Map vs Object — Map: any key, ordered, .size property, iterable. Object: string/symbol keys only