Sets are an essential data structure in JavaScript that allows you to store unique values of any type. Iterating through a set is a common operation that enables you to access and process the elements within it.

In this blog post, we will explore various methods to iterate through sets in JavaScript, along with code examples.

Using the forEach method for Set Iteration

The forEach method is a concise and straightforward way to iterate through a set. It executes a provided callback function once for each element in the set, in insertion order.

const mySet = new Set([1, 2, 3, 4, 5]);

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

The output:

1
2
3
4
5

Utilizing the for...of loop for Set Iteration

The for...of loop is an elegant and expressive way to iterate through any iterable, including sets. It allows you to access each value directly within the loop body.

const mySet = new Set(['apple', 'banana', 'orange']);

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

The output:

apple
banana
orange

Converting a set to an array for Set Iteration

If you need to leverage array-specific methods or iterate using traditional loops, you can convert a set to an array using the spread operator (...) or the Array.from() method.

const mySet = new Set(['cat', 'dog', 'bird']);

// Using spread operator
const setArray1 = [...mySet];
for (let i = 0; i < setArray1.length; i++) {
  console.log(setArray1[i]);
}

// Using Array.from()
const setArray2 = Array.from(mySet);
for (let i = 0; i < setArray2.length; i++) {
  console.log(setArray2[i]);
}

The output:

cat
dog
bird

Leveraging the entries() method for Set Iteration

The entries() method returns a new iterator object that contains an array of [value, value] for each element in the set. You can utilize this iterator to access both the key and value of each element.

const mySet = new Set([10, 20, 30]);

for (const [value, key] of mySet.entries()) {
  console.log(`Key: ${key}, Value: ${value}`);
}

The output:

Key: 10, Value: 10
Key: 20, Value: 20
Key: 30, Value: 30

Conclusion

Iterating through sets in JavaScript is a powerful technique for working with unique collections of values. In this blog post, we explored various methods for iterating through sets, including forEach, for...of loop, converting to an array, and utilizing the entries() method.

Each method provides a different approach and can be chosen based on your specific use case. By mastering set iteration, you’ll be equipped to handle sets efficiently in your JavaScript applications.