Map and Set in JavaScript

Full-stack developer with a good foundation in frontend, now specializing in backend development. Passionate about building efficient, scalable systems and continuously sharpening my problem-solving skills. Always learning, always evolving.
JavaScript objects and arrays cover most cases, but they break down when you need flexible keys or guaranteed uniqueness. Map and Set exist to solve those gaps with clearer semantics and better performance characteristics.
What Map is
Map is a key value store where keys can be any type and insertion order is preserved.
const map = new Map();
map.set("name", "Ali");
map.set(42, "number key");
map.set({ id: 1 }, "object key");
console.log(map.get(42)); // "number key"
console.log(map.size); // 3
Why this matters:
Object keys are limited to strings and symbols
Mapallows objects, numbers, functions as keysIteration order is guaranteed
for (const [key, value] of map) {
console.log(key, value);
}
What Set is
Set is a collection of unique values. Duplicate entries are ignored.
const set = new Set();
set.add(1);
set.add(1);
set.add(2);
console.log(set); // Set {1, 2}
Uniqueness is enforced automatically:
const ids = [1, 2, 2, 3];
const uniqueIds = new Set(ids);
console.log([...uniqueIds]); // [1, 2, 3]
Difference between Map and Object
Key types
const obj = {};
obj[{}] = "value";
console.log(obj); // { "[object Object]": "value" }
Object coerces keys to strings. This causes collisions.
const map = new Map();
const key = {};
map.set(key, "value");
console.log(map.get(key)); // "value"
No coercion in Map. Keys stay distinct.
Iteration
Objects are not directly iterable:
Object.keys(obj).forEach(k => console.log(k));
Map is iterable by default:
for (const [k, v] of map) {
console.log(k, v);
}
Order
Objects have complex ordering rules. Map strictly preserves insertion order.
Use case
Use
Objectfor simple JSON-like dataUse
Mapwhen keys are dynamic, non-string, or frequently added/removed
Difference between Set and Array
Uniqueness
const arr = [1, 1, 2];
console.log(arr); // [1, 1, 2]
const set = new Set(arr);
console.log([...set]); // [1, 2]
Array allows duplicates. Set does not.
Lookup
arr.includes(2); // O(n)
set.has(2); // O(1) average
Set provides faster membership checks.
Use case
Use
Arrayfor ordered collections with duplicatesUse
Setwhen uniqueness and fast lookup matter
When to use Map and Set
Map example: caching or lookup table
const userCache = new Map();
function getUser(id) {
if (userCache.has(id)) {
return userCache.get(id);
}
const user = fetchUserFromDB(id);
userCache.set(id, user);
return user;
}
Using Object here risks accidental key collisions and lacks clear intent.
Set example: deduplication and membership
const visited = new Set();
function visit(node) {
if (visited.has(node)) return;
visited.add(node);
// process node
}
This pattern shows up in graph traversal, caching, and avoiding repeated work.
Diagrams
Map Key Value Storage
Set Uniqueness Representation
Conclusion
Map and Set are not replacements for objects and arrays. They solve specific problems:
Mapremoves key restrictions and gives predictable iterationSetenforces uniqueness with efficient lookup
Use them when those guarantees matter. Otherwise, stick with simpler structures to keep code straightforward.




