Arshia Shahidi | Understanding JavaScript Set: When, Why, and How to Use It

Set is one of the built-in data structures in javascript. Let's dive into what a Set is, how it differs from an Array or Map, and when (or where not) to use it.

Quick Comparison Table

Feature	`Array`	`Set`	`Map`
Stores	Any items (in order)	Unique values only	Key + value pairs
Allows duplicates	✅ Yes	❌ No	✅ Values yes, keys no
Access by index	✅ Yes (`arr[0]`)	❌ No	❌ No
Key/value lookup	❌ No	❌ No	✅ Yes (`map.get(key)`)
Fast search	❌ No (`includes`)	✅ Yes (`has`)	✅ Yes (`has`, `get`)
Ideal use case	Ordered data, UI rendering	Uniqueness, fast lookups	Lookup table, dynamic objects

What is `Set` in JavaScript?

It lets you store unique valuse of any type - primitive values or object references.

const mySet = new Set();

mySet.add(1);
mySet.add(5);
mySet.add(5); // Duplicate values are ignored

console.log(mySet); // Set { 1, 5 }

No duplicates allowed
Maintains insertion order (just like an array)

Use it when:

You want unique values only
You care about fast lookups (.has(value))
You want to remove duplicates easily

const numbers = [1, 2, 2, 3];
const unique = [...new Set(numbers)]; // [1, 2, 3]

Don’t use if:

You need index access (myArray[1])
You want to use .map() or .filter() - Those are array methods, use Array instead

Speed Comparison

Task	`Array`	`Set`	`Map`
Check if value exists	❌ Slower	✅ Fast	✅ Fast
Add or remove items	✅ Easy	✅ Easy	✅ Easy
Find by key/index	✅ By index	❌ Not possible	✅ By key

Easy Usage Examples

You need...	Use this
A list with duplicates allowed	`Array`
A list with no duplicates	`Set`
A list with key + value	`Map`
To check if something is included, fast	`Set` or `Map`
To remove duplicates from a list	`Set`

Example: Merging Permissions with Set

Let's say you want to query your databse and get something like this:

const dbResult = [
    { name: "Arshia", permission: "read" },
    { name: "Arshia", permission: "write" },
    { name: "Arshia", permission: "read" }, // <---- duplicate
];

You want to collect all permissions without duplicates.

Here's how Set can help:

tyoe UserPermissionRow = {
    name: string;
    permission: string;
};

const mergePermissions = (rows: UserPermissionRow[]) => {
    if (rows.length === 0) throw new Error("No rows to merge");
    const result = {
        name: rows[0].name ?? "Unknown",
        permissions: new Set<string>(), // initialize an empty set
    };

    for (const row of rows) {
        // duplicates will be ignored
        result.permissions.add(row.permission);
    }

    console.log(result);
    /**
     * {
     *   name: 'Arshia',
     *   permissions: Set { 'read', 'write' } // <---- a set of unique permissions
     * }
     */

    return {
        ...result,
        permissions: Array.from(result.permissions), // convert set to array
    };
};

mergePermissions(dbResult);

console.log(mergePermissions(dbResult));
/**
 * {
 *   name: 'Arshia',
 *   permissions: [ 'read', 'write' ]
 * }
 */

With plain arrays, you’d have to check for duplicates manually.
With Set, you don’t worry — it keeps only unique values.
It's perfect when you're merging roles, tags, categories, etc.