JavaScript for…of

What is the For…of Loop?

The JavaScript for … of statement creates a renewed loop on renewable objects. The For … loop is introduced to be an alternative to both the inin and forEach () method in ES6 and supports the new iteration protocol. It allows you to loop on repeatable data structures, such as For..of, Arrays, Strings, Maps, Clusters, and more.

Syntax:

for (var of ite) {
// codes………..
}

• var: It updates the variable every time the loop is refreshed.
•  ite: An object which has enumerable properties and can be iterated upon.

---

Use in the Array

JavaScript arrays are similar to the list. There are a number of methods that allow processes such as transition operations in the array prototype to perform.

Example 1

        let list = [1, 2, 3, 4, 5, 6];

        for(let value of list) {
            value += 1;
            console.log(value)
        }

2
3
4
5
6
7

---

Example 2

        let txt = ["first","second","third"];

        for(let value of txt) {
            console.log(value)
        }

first
second
third

---

Use in the Map

The JavaScript map object holds key-value pairs. A map object is repeated between items, depending on how it is placed. In turn, the for … of loop returns a sequence of key / value pairs for each iteration.

Example

        let loginSystem = new Map([
            ["person1", 123],
            ["person2", 234],
            ["person3", 345],
        ])

        for(let system of loginSystem) {
            console.log(system);
        }

        for(let [a,b] of loginSystem) {
            console.log(a);
        }

        for(let [a,b] of loginSystem) {
            console.log(b);
        }

[“person1”, 123]
[“person2”, 234]
[“person3”, 345]
person1
person2
person3
123
234
345

---

Use in the String

Strings are used to store data in text form.

Example

        let txt = "truecodes";
        let list = [];

        for(let value of txt) {
            list += value + ",";
        }
        console.log(list)

t,r,u,e,c,o,d,e,s

---

Use in the Set

The JavaScript Set object allows you to store unique values ​​of any type that could be primitive values ​​or objects. The iteration in the elements of a Cluster is based on the order of insertion. A value in the set can only occur once. If you create a cluster that has the same item multiple times in a sequence, it is still considered to be a single element.

Example

        let numberList = new Set([1, 2, 3, 4, 5]);

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

1
2
3
4
5

---

---

 The Arguments Object

You can refresh arguments to examine all parameters that pass to the JavaScript function.

Example

        (function () {
            for(let value of arguments) {
                console.log(value);
            }
        })("first", "second", "third");

first
second
third

---

Generators

Generators are functions which can be exited and later re-entered.

Example

function* generator(){ 
  yield 1; 
  yield 2; 
  yield 3; 
}; 

for (const g of generator()) { 
  console.log(g); 
}

1
2
3

---

Closing Iterators

JavaScript offers four known methods of terminating a loop execution namely: break, continue, return and throw.

Example

        function* myFunction(){ 
            yield 1; 
            yield 2; 
            yield 3;
        }; 

        for (let arr of myFunction()) { 
            console.log("break: " + arr); 
            break;
        }

        for (let arr of myFunction()) { 
            console.log("continue: " + arr); 
            continue;
        }

break: 1
continue: 1
continue: 2
continue: 3