Loops (for and while) in JavaScript

In the earlier tutorial we learn't about conditional statements in Javascript. In this tutorial, we shall explore Loops. When you want to repeat some statements in JavaScript, you can use loops. There are 2 types of loops available:

For Loop
While loop

Let’s go through each of these in detail

Javascript Image

1. For Loop

When you are already aware of the number of the number of iterations you want to repeat for your statements, then you can use “for” loop.

The syntax to use “for” loop is given below for reference.


                    for(let i=0;i<10;i++){
	//statements to iterate
}

Here, the condition statements inside the “for” loop consists of 3 parts:

“let i=0”: Here, we initialize an iteration variable called “i”. In this example, it is initialized to 0.
"i<10" : The loop keeps running till the iteration variable is less than a given value, in this case, till the iteration variable is less than 10.
“i++”: This implies that after every iteration, the iteration variable will be incremented. In this example it is being incremented by 1. It is equivalent to i=i+1;

E.g.


                    for(let i=0;i<10;i++){
	console.log(“The current iteration is:”+i);
}

In this example, the loop iterates for 10 times starting with iteration when i=0 till the value of “i” is less than 10. At the end of each iteration, the value of iteration variable “i” increases by 1. In each iteration, the above script executes the console log statement.

2. While Loop

When you are not aware of the exact number of iterations you want to repeat for your script, then you can use “while” loop.

The syntax to use “while” loop is given below for reference


                    while(condition){
	//statements to iterate
	//optional – update the variable which is used to check the condition 
}

Here, a condition should evaluate to "true" for the statement inside the loop to execute further. If the condition evaluates to "false", then the statement inside the loop will not be executed further and the execution will move to the next statement after the while loop’s block.

E.g.


                    let count=0;
while(count<10){
	console.log(“The current iteration is: ”+i);
	count++; 
}
console.log(“The loop ended);

In this example, we have initialized a variable called “count” as 0. This variable will be used to evaluate the condition in the while loop. In the next line the while loop checks for the condition “count<10”. If the count is less than 10, then the statements inside the loop will be executed.

Inside the loop, we can see the console log statement. It will be executed in the initial iteration. In the next statement, the count variable is increased by 1. This means in the next iteration, the count variable will be equal to 1. Now the while condition will be checked again to see if the count is still less than 10 or not. Since 1 is less than 10, the condition evaluates to “true”, hence the loop statements will be executed again. Once the value of count variable reaches 10, the while loop will not be executed further. System will move the execution to the statements which are after the while loop block. In this case the console log statement mentioning “The loop ended” will be executed.

I hope this tutorial gave you a fair idea on how to use loops in JavaScript.

Follow Me on Social Media

Follow @speaktechnology

FREE Sales CRM Software

Fully customizable CRM Software for Freelancers and Small Businesses

Signup for Free

Sign up for DigitalOcean Cloud

Get FREE $200 credits, deploy your hobby projects for Free