Map and Set in JavaScript

In this article, we’ll learn about two important data structures in JavaScript: Map and Set.

What we are going to learn:

What Map is
What Set is
Difference between Map and Object
Difference between Set and Array
When to use Map and Set

What Map is?

A Map is a collection of key-value pairs, just like an object — but more powerful and flexible.

The main difference is:
In a Map, keys can be of any type (not just strings).

Example:

const map = new Map();

map.set("name", "Josh");
map.set(1, "number key");
map.set(true, "boolean key");

console.log(map.get("name")); // Josh
console.log(map.get(1)); // number key

Important methods:

map.set(key, value)   // add value
map.get(key)          // get value
map.has(key)          // check if key exists
map.delete(key)       // remove key
map.clear()           // remove all

What Set is?

A Set is a collection of unique values.

It automatically removes duplicates.

Example:

const set = new Set([1, 2, 2, 3, 4, 4]);

console.log(set); // {1, 2, 3, 4}

Important methods:

set.add(value)     // add value
set.has(value)     // check value
set.delete(value)  // remove value
set.clear()        // remove all

Difference between Map and Object

Feature	Map	Object
Key type	Any type (number, object, boolean)	Only string or symbol
Order	Maintains insertion order	Not guaranteed (older behaviour)
Iteration	Easy with `for...of`	Need extra methods
Performance	Better for frequent add/remove	Good for simple use cases

Example:

const obj = {};
obj[1] = "one";   // converted to string "1"

const map = new Map();
map.set(1, "one"); // stays number

So Map keeps the original type of keys.

Difference between Set and Array

Feature	Set	Array
Duplicates	Not allowed	Allowed
Order	Maintains order	Maintains order
Access	No index	Index-based
Use case	Unique values	Ordered list

Example:

const arr = [1, 2, 2, 3];
const set = new Set(arr);

console.log(arr); // [1, 2, 2, 3]
console.log(set); // {1, 2, 3}

When to use Map and Set

Use Map when:

You need key-value pairs
Keys are not just strings (like numbers, objects)
You need better performance for frequent updates

Example:

const userRoles = new Map();

userRoles.set("user1", "admin");
userRoles.set("user2", "editor");

Use Set when:

You need unique values only
You want to remove duplicates
You just care about existence (not position)

Example:

const numbers = [1, 2, 2, 3, 4];
const uniqueNumbers = new Set(numbers);

console.log(uniqueNumbers); // {1, 2, 3, 4}

Final Thoughts

Map is like an advanced object with more flexibility
Set is perfect when you only care about unique values

Both are very useful in real-world applications, especially when working with data.

Start using them in small projects, and you’ll quickly understand where they fit best.

Map and Set in JavaScript

Comments

More from this blog

How Instagram Stores Reels, Photos, and Drafts Behind the Scenes

How WhatsApp Works Without Internet: Offline Messaging and Sync Explained

Expo Router vs React Navigation - Which One Should You Use in 2026?

How Instagram, WhatsApp, Uber & Netflix Would Be Built Today Using Expo Router

How React Virtual DOM works under the hood

What Map is?

Example:

Important methods:

What Set is?

Example:

Important methods:

Difference between Map and Object

Example:

Difference between Set and Array

Example:

When to use Map and Set

Use Map when:

Use Set when:

Final Thoughts

Command Palette

Comments

More from this blog

What Map is?

Example:

Important methods:

What Set is?

Example:

Important methods:

Difference between Map and Object

Example:

Difference between Set and Array

Example:

When to use Map and Set

Use Map when:

Use Set when:

Final Thoughts