In JavaScript, there are the following types of loops: for for..in, for..of, while, do..while
for loop
for ([value - counter initialization]; [execution condition]; [change counter per step]) {
// action
}
Let’s consider an example:
for (let i = 0; i < 10; i++) {
console.log(i);
}
console.log("End of work");
Variable i sets the initial value.
i<10 is the value up to which actions will be performed in the cycle.
i++ – indicates what we will do with the variable at each iteration cycle, it is not necessary to increase the counter by one, it is possible to perform other actions with it, for example, to decrease it per unit:
for(let i = 100; i > 75; i--){}//at each iteration we will decrease by one
for(let i = 0; i < 10; i+=2){//or we will increase by 2 at each iteration
Several variables in a loop
If necessary, you can use several counters:
for (let i = 1, j = 1; i < 5, j < 4; i++, j++) {
console.log(i + j);
}
1 iteration: i=1, j=1; i + j = 2
2 iteration: i=2, j=2; i + j = 4
3 iteration: i=3, j=3; i + j = 6
At the moment when i=4 i j=4 the value of variable i meets the condition i < 5, but the value of variable j (4) does NOT meet the condition j < 4. So the loop exits. His work is completed.
While and do..while
The while loop through the block of code as long as the given condition evaluates to true:
while (condition) {
//actions
}
Let’s consider an example:
let i = 1;//let's set the initial value in variable i
while (i <= 5) {//we will run the loop until i is less than 5
console.log(i);//let's output the value of the variable to the console
i++;//let's increase the value of i by one
}
The while loop will run until the value of i becomes 6.
Almost a copy of the while loop, with the difference that in the do loop, the code of the loop is executed first, and then the condition in the while statement is checked.
Let’s look at an example:
let i = 1;//let's set the initial value in variable i
do {//block of code that we will execute
console.log(i);//output the value of i to the console
i++;//increase the value by one
} while (i <= 10)//we will run the code in the do block until i is less than 10
For in loop
This type of loops is mainly intended for iterating objects:
for (property in object) {
//actions
}
Consider an example:
const user = { name: "Alex", city: 'London' };//let's write the object in the user variable
for (prop in user) {//properties of the user object will be written to the prop variable
console.log(prop);//with each iteration, a new property will be output to the console
}
In the console we will see:
//name //city
For of loop
The for…of loop is designed to iterate over datasets. For example, the string actually represents the set characters. And we can iterate over it with this loop:
const hello = "HELLo.";//create website constant
for (word of hello) {//characters from the hello constant will be written to the word constant
console.log(word);//output characters to the console
}
In the console we will get:
H E L L o .
Arrays can also be iterated with the for of loop.
Let’s consider an example:
const people = ["Tom", "Sam", "Bob"];//an array of names
for (const person of people) {//we will write an element of the people array into the person variable
console.log(person);//output to the console
}
We’ll see in the conosol:
Tom Sam Bob
Loop in loop
Other loops can be nested in some loops.
Let’s look at an example again:
for (let i = 1; i <= 5; i++) {
for (let j = 1; j <= 5; j++) {
console.log(i * j);
}
}
After starting one iteration of the outer loop, the inner loop will start and execute completely, j<=5, so 5 times. The outer loop will also be executed 5 times (i<=5), so the inner loop will be to be performed 25 times!