JS Sets

Think of a guest list at the door of an event, each name is checked before being added, and no name ever appears twice, no matter how many times someone tries to add themselves again. A Set in JavaScript is exactly that guest list, a collection that automatically enforces uniqueness, adding a value that's already present simply does nothing, silently keeping the collection free of duplicates. Sets are handy anywhere you need a list of genuinely distinct values, like tracking which unique tutorial topics a visitor to cookiescursor.com has viewed.

In this page:

Creating a Set
add, delete, and has
The size Property
Iterating a Set
Set vs Array

Syntax

javascript

const setName = new Set([item1, item2]);
setName.add(item);
setName.has(item);
setName.delete(item);

Creating a Set

A Set is created with new Set(), optionally passing an iterable like an array, and any duplicate values in that initial array are automatically dropped, leaving only unique entries.

Note: Passing an existing array into new Set() is a quick, common way to remove duplicate values from that array.

Warning: A Set preserves the type of its values strictly, the number 1 and the string 1 are treated as two different, distinct entries.

Example: Creating a Set

javascript

const nums = new Set([1, 2, 2, 3]);
console.log(nums); // duplicates dropped: {1, 2, 3}

add, delete, and has

add() inserts a new value into the Set, delete() removes a specific value and returns whether it was actually present, and has() checks whether a given value already exists in the Set.

Note: has() runs very efficiently on a Set, making it a great choice for checking membership in a large collection compared to array.includes().

Warning: Calling add() with a value already in the Set does nothing and does not throw an error, the Set silently stays unchanged.

Example: add, delete, and has

javascript

// Declare the constant `nums` as a new `Set` instance
// Declare the constant `nums` as a new `Set` instance
const nums = new Set();
// Call `nums.add(1)`
// Call `nums.add(1)`
nums.add(1);
// Call `nums.add(2)`
// Call `nums.add(2)`
nums.add(2);
// Print `nums.has(1)` to the console
// Print `nums.has(1)` to the console
console.log(nums.has(1));
// Call `nums.delete(1)`
// Call `nums.delete(1)`
nums.delete(1);
// Print `nums.has(1)` to the console
// Print `nums.has(1)` to the console
console.log(nums.has(1));

The size Property

A Set's size property reports how many unique values it currently contains, functioning the same conceptual role as length does for arrays and strings. Unlike array length, size is read-only and always reflects the Set's actual current contents.

Note: Comparing an array's length against a Set built from it, like new Set(array).size, is a quick way to check if the array had any duplicates.

Warning: size is a property, not a method, it's accessed without parentheses, mySet.size, not mySet.size().

Example: The size Property

javascript

const nums = new Set([1, 2, 3]);
console.log(nums.size);

Iterating a Set

Sets are iterable, letting you loop through every unique value using for...of, in the same order the values were originally added.

This insertion-order guarantee makes Sets predictable to iterate even though they're built around uniqueness rather than position.

Note: Sets maintain insertion order, so iterating one always visits values in the exact order they were first added.

Warning: You cannot use a regular indexed for loop, like mySet[i], on a Set, it has no index-based access at all.

Example: Iterating a Set

javascript

// Declare the constant `nums` as a new `Set` instance
// Declare the constant `nums` as a new `Set` instance
const nums = new Set([1, 2, 3]);
// Loop over `nums`, binding each item to `n`
// Loop over `nums`, binding each item to `n`
for (let n of nums) {
  // Print `n` to the console
  // Print `n` to the console
  console.log(n);
}

Set vs Array

A Set automatically enforces uniqueness and offers very fast membership checks with has(), while an array allows duplicates and supports rich methods like map, filter, and indexed access that Sets don't have.

Note: Convert a Set back to an array with the spread operator, [...mySet], whenever you need array-specific methods like map or filter.

Warning: Choosing a Set purely for its uniqueness but then needing frequent array-style operations often means converting back and forth repeatedly, consider whether an array with manual duplicate checks might be simpler.

Example: Set vs Array

javascript

const set = new Set([1, 2, 2, 3]);
const arr = [1, 2, 2, 3];
console.log(set.size, arr.length); // 3 vs 4
console.log(set.has(2), arr.indexOf(2) !== -1);

Live Example

Chapter Quiz — Complete all 26 topics to unlock

0/26 topics done

Complete these topics first:

← Previous Lesson JS Iterables Next Lesson → JS Set Logic

JS Sets

Creating a Set

add, delete, and has

The size Property

Iterating a Set

Set vs Array

Chapter Quiz — Complete all 26 topics to unlock

Login to run this code