Set() objects are groups of distinct values. A set is a collection of unique elements i.e. no element can appear more than once in a set. Because sets in ES6 are ordered, the items of a set can be iterated in the order of insertion. Object and primitive values can both be stored in sets.
We can iterate over the set elements using the following methods in Javascript:
- Using for…of loop
- Using forEach() method
- Using Array.from() and for loop Methods
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.
Syntax:
for (const value of mySet) {
...
}
Example: This example shows the iteration of set elements using the for…of loop in Javascript.
Javascript
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.
Syntax:
set.forEach(function (parameter) {
...
});
Example: Here we use forEach method to iterate our set elements.
Javascript
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:
Javascript
// 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