Iterate over Set in JavaScript or JS

We will iterate over set elements in JavaScript. A set is a collection of unique elements i.e. no element can appear more than once in a set.

Below are the approaches to iterate over set elements in JavaScript:

Approach 1: Using for…of loop

The for…of loop iterates over the iterable objects (like Array, Map, Set, arguments object, …, etc), invoking a custom iteration hook with statements to be executed for the value of each distinct property.

const mySet = new Set();

mySet.add("Virat");
mySet.add("Rohit");
mySet.add("Rahul");

for (const value of mySet) {
    console.log(value);
}

Virat
Rohit
Rahul

Approach 2: Using forEach() Method

The arr.forEach() method calls the provided function once for each element of the array. The provided function may perform any kind of operation on the elements of the given array. 

const Data = new Set();

Data.add("Delhi");
Data.add("Noida");
Data.add("Gurgaon");

Data.forEach(function (value) {
    console.log(value);
});

Delhi
Noida
Gurgaon

Approach 3: Using Array.from() and for loop Methods

In this approach, we will use an array.from() method to convert the set into an array and then we iterate using the for loop.

Example: This example shows the implementation of above-explained approach.

// Initialize a Set object
// using Set() constructor
let myset = new Set()

// Insert new elements in the
// set using add() method
myset.add(3);
myset.add(2);
myset.add(9);
myset.add(6);

// Print the values stored in set
console.log(myset);

const myArray = Array.from(myset);
for (let i = 0; i < myArray.length; i++) {
    console.log(myArray[i]);
}

Set(4) { 3, 2, 9, 6 }
3
2
9
6

Approach 4: Using Lodash _.forEach() method

In this example, we are using the Lodash _.forEach() method for iteration of set.

Example: This example shows the implementation of above-explained approach.

// Requiring the lodash library 
const _ = require("lodash");
const Data = new Set();

Data.add("Delhi");
Data.add("Noida");
Data.add("Gurgaon");

// Use of _.forEach() method 
_.forEach(Data, function (value) {
    console.log(value);
});

Output:

Delhi
Noida
Gurgaon

Approach 5: Using Spread Operator

The spread operator … can be used to expand elements of an iterable like a Set into an array. This array can then be directly iterated using any array iteration method such as forEach().

function iterateSet() {
    const mySet = new Set();
    mySet.add("London");
    mySet.add("Paris");
    mySet.add("New York");

    [...mySet].forEach(value => {
        console.log(value);
    });
}

iterateSet();

London
Paris
New York

Approach 6: Using Set.values() Method

The Set.values() method returns a new Iterator object that contains the values for each element in the Set object in insertion order. You can use a for…of loop to iterate over these values.

const mySet = new Set();
mySet.add("Blue");
mySet.add("Green");
mySet.add("Red");

for (let value of mySet.values()) {
    console.log(value);
}

Blue
Green
Red