JavaScript - Sets

Grokking JavaScript Fundamentals

Ask Author

Back to course home

0% completed

Vote For New Content

JavaScript - Sets

Table of Contents

Contents are not accessible

A Set in JavaScript is a collection of unique values of any type, whether primitive values or object references. Sets are particularly useful when the need to ensure the uniqueness of elements is a priority, as they automatically remove duplicates.

Syntax

To create a Set, you can use the Set() constructor, optionally passing an iterable object (such as an array) to initialize the set with unique values from that iterable.

Javascript

. . . .

iterable (optional): An array or other iterable object whose elements will be added to the new Set.

Example of Creating Sets

Javascript

. . . .

Above code initializes a Set colors with three values: "red", "green", and "blue". Even though "red" appears twice in the array, it's only stored once in the Set.

Properties of Sets

Sets come with a property that helps to inspect the collection:

Property	Description
`size`	Returns the number of values in the Set object.

Methods of Sets

Sets offer a variety of methods to manipulate the data:

Method	Description
`add(value)`	Adds a new element with the specified value to the Set.
`delete(value)`	Removes a specified value from the Set.
`has(value)`	Returns a boolean indicating whether the specified value exists in the Set.
`clear()`	Removes all elements from the Set.
`values()`	Returns a new Iterator object containing all the values in insertion order.
`entries()`	Returns a new Iterator object containing an array of `[value, value]` for each element in insertion order.
`forEach(callbackFn[, thisArg])`	Executes a provided function once for each value in the Set object.

Examples

Example 1: Adding Elements and Checking Existence

In this example, we will add elements to a Set and check if a specific value exists within the Set.

Javascript

. . . .

let numbers = new Set(); initializes a new empty Set named numbers.
numbers.add(1); adds the number 1 to the Set.
numbers.add(2); adds the number 2 to the Set. The Set now contains two elements: 1 and 2.
console.log(numbers.has(1)); checks if the Set contains the number 1. Since 1 was added to the Set, it returns true.

Example 2: Iterating Over a Set

In this example, we will iterate over a Set using the forEach method and print each element.

Javascript

. . . .

let numbers = new Set([1, 2, 3]); creates a Set named numbers with three elements: 1, 2, and 3.
numbers.forEach((value) => { console.log(value); }); uses the forEach method to iterate over each element in the Set. For each element, it executes the provided callback function, which logs the element to the console. This results in 1, 2, and 3 being logged.

Example 3: Intersection of Two Sets

In this example, we demonstrate how to find the intersection of two Sets, resulting in a new Set containing only the elements present in both Sets.

Javascript

. . . .

let setA = new Set([1, 2, 3]); and let setB = new Set([2, 3, 4]); create two Sets, setA with elements 1, 2, 3 and setB with elements 2, 3, 4.
[...setA] uses the spread operator to create an array containing all elements of setA.
.filter(x => setB.has(x)) filters this array, keeping only the elements that are also present in setB.
new Set([...setA].filter(x => setB.has(x))); creates a new Set from the filtered array, which contains only the elements present in both setA and setB. The resulting Set is intersection, which contains 2 and 3.
console.log(intersection); logs the resulting Set to the console, showing the intersection of setA and setB: Set {2, 3}.

.....

Like the course? Get enrolled and start learning!

Table of Contents

Contents are not accessible