Wait, why do I need this if I already have Arrays?

I'll be honest: at first glance, a Set looks like a stripped-down Array. It holds a list of values, you can add to it, and you can iterate over it. But there is one massive difference: a Set cannot contain duplicate values. If you try to add the same string or number twice, the Set simply ignores the second attempt.

Beyond just uniqueness, there's a performance win here. If you have a list of 10,000 items and you want to check if a specific ID exists, array.includes() has to potentially look at every single element until it finds a match. A Set uses a hash table under the hood, meaning set.has() is nearly instantaneous regardless of how large the set is. If you're doing frequent lookups, stop using arrays and switch to a Set.

Is there a quick way to use this to clean up a messy array?

This is actually the most common way I use Sets in my daily work. Let's say you're pulling tags from a database for a blog post, and for some reason, the data is dirty and contains duplicates.

const rawTags = ['javascript', 'webdev', 'javascript', 'frontend', 'webdev', 'coding'];

// The "Magic" One-Liner
const uniqueTags = [...new Set(rawTags)];

console.log(uniqueTags); // ['javascript', 'webdev', 'frontend', 'coding']

Here's what's happening: I pass the array into new Set(), which immediately strips out the duplicates. But since that returns a Set object and not an array, I wrap the whole thing in brackets and use the spread operator (...) to "spread" those unique values back into a fresh array. It's clean, fast, and far better than writing a forEach loop with an if statement inside it.

How do I actually manage the data inside a Set?

Managing a Set is slightly different from an Array. You don't have indexes (you can't do mySet[0]), because the order isn't the primary focus—the uniqueness is. Instead, you use a few specific methods:

• .add(value): Adds a new element. You can chain these together since .add() returns the set itself.
• .has(value): Returns a boolean. This is your replacement for .includes().
• .delete(value): Removes a specific element.
• .clear(): Wipes the entire thing.
• .size: A property (not a function!) that tells you how many items are inside.

const activeUsers = new Set();

activeUsers.add('user_123').add('user_456').add('user_123'); 

console.log(activeUsers.size); // 2 (because user_123 was added twice)

if (activeUsers.has('user_456')) {
    console.log('User is online!');
}

activeUsers.delete('user_123');

📋 Practical Task

Exercise: Guest List De-duplicator

You are building a check-in system for a tech conference. Due to a bug in the registration form, some guests have signed up multiple times using the same email address. You have been given an array of emails, but your badge-printing software will crash if it receives duplicate entries.

Your Task:

1. Create an array called rawGuestList containing the following emails: 'alice@example.com', 'bob@example.com', 'alice@example.com', 'charlie@example.com', and 'bob@example.com'.
2. Use a Set to remove the duplicates from this array.
3. Convert that Set back into an array called cleanedGuestList.
4. Log the cleanedGuestList to the console and log the total number of unique guests using the .length property of the resulting array.