JS MASTER CLASS /// LEARN SETS /// DEDUPLICATE ARRAYS /// UNIQUE VALUES /// JS MASTER CLASS /// LEARN SETS /// DEDUPLICATE ARRAYS /// UNIQUE VALUES /// JS MASTER CLASS /// LEARN SETS /// DEDUPLICATE ARRAYS /// UNIQUE VALUES ///

JavaScript Sets

Unlock the power of unique data. Learn to filter arrays and leverage high-performance lookup methods natively in JavaScript.

sets.js
1 / 14
12345
πŸ“¦

Tutor:JavaScript Arrays are great, but sometimes you need a collection where every item is UNIQUE. Enter the JavaScript Set. It’s an object that lets you store unique values of any type.


Skill Matrix

UNLOCK NODES BY MASTERING SETS.

Concept: Instantiation

Create Sets using the new Set() constructor. You can pass an array as the initial value.

System Check

What is the resulting size of: new Set([1, 1, 2])?


Community Holo-Net

Showcase Your Data Structs

ACTIVE

Found a cool algorithm using Sets? Share your logic and deduplication tricks.

JavaScript Sets

Author

Pascual Vila

Senior Developer // Code Syllabus

A Set is a special type collection – β€œset of values” (without keys), where each value may occur only once. Introduced in ES6, it provides high-performance value checking compared to standard Arrays.

Sets vs Arrays

While Arrays use indexes (0, 1, 2) to store and retrieve data, Sets operate without an index. The main feature of a Set is its uniqueness constraint: you cannot add the exact same value twice. If you attempt to add an existing value, the Set ignores it quietly.

Key Properties & Methods

  • .add(value) β€” Appends value to the set, returns the set itself.
  • .has(value) β€” Returns true if the value exists in the set, otherwise false.
  • .delete(value) β€” Removes the value. Returns true if value existed.
  • .clear() β€” Removes everything from the set.
  • .size β€” Returns the current element count. Note: it is NOT length.

The Classic Use Case: Deduplication

The most common use case for a Set in everyday JavaScript is filtering an array to remove duplicate elements. Because the Set constructor accepts an iterable, and the spread operator translates iterables back into arrays, deduplication is a clean one-liner:

const rawData = ['apple', 'banana', 'apple', 'orange'];
const uniqueData = [...new Set(rawData)];
// uniqueData is ['apple', 'banana', 'orange']
View WeakSet Details+

In JavaScript, there is also a data structure called WeakSet. A WeakSet behaves similarly to a Set, but it only accepts objects as values, and references to those objects are held "weakly". This means that if there are no other references to an object stored in the WeakSet, it can be garbage collected. This makes WeakSets great for tracking objects without causing memory leaks, although they cannot be iterated over.

Sets Glossary

new Set()

The constructor used to create a new Set object. You can pass an iterable (like an array) to initialize it.

snippet.js

add(value)

Appends a new element with the given value to the Set object. Returns the Set.

snippet.js

has(value)

Returns a boolean indicating whether an element with the specified value exists in the Set.

snippet.js

delete(value)

Removes the element associated to the value. Returns a boolean asserting whether an element was successfully removed or not.

snippet.js

size

A property that returns the number of elements in the Set object. Analogous to an Array's length.

snippet.js

Iterable

An object that implements the iterable protocol, allowing it to be used in a for...of loop or spread operator. Sets are iterables.

snippet.js