Learn JavaScript

JavaScript for Loop

JavaScript for Loop is very useful in JavaScript programming. It is used for the compact form of looping in JavaScript. Whenever you want to execute a particular set of code snippets multiple times, with different set of input values, in that case you can take the help of for loop. It is most commonly use to execute array.

Standard Syntax of a for Loop

for (Loop Initialization; Loop Test Condition; Loop Iteration Statement)
{
Statement 1;
Statement 2;
Statement 3;
.
.
.
Statement n;
// set of statements execute, if the test condition is true
}

Explanation

Loop Initialization: In loop initialization, the initial value or starting value is assign to the counter variable. The execution of a loop begins from The loop initialization statement. This is executed only for first time, before execution of the for block.

Loop Test Condition: After initialization of the counter variable, the next statement that is executed under JavaScript loop is loop test condition. The loop test condition is checked and, if the truth value of the test condition is found to be true then control passes inside the loop and the set of statements within the loop will be executed. If the truth value of the loop test condition is false, then the control exit from the loop for next iteration.

Loop Iteration Statement: Loop iteration statement is a statement, where you can increase or decrease the value of the counter value. This statement is executed, until the iteration exhausted.

JavaScript for Loop Compact Form

In order to understand the compact form of for looping, consider the following two code snippets. Where you can easily observe that, the first code snippet is more compact than the second one.


Example 1

<html>
<body>
<h2>Program to understand the working of for loop</h2>
<h3>Winner of ICC T20, 2021 is Chosen from the Following Teams</h3>
<script>
var team = ["India", "England", "NewZeland", "SouthAfrica", "Scotland"];
var winner = "";
var i;
for (i = 0; i < 5; i++)
{
winner += team[i] + "<br>";
}
document.write(winner);
</script>
</body>
</html>

Output

Program to understand the working of for loop

Winner of ICC T20, 2021 is Chosen from the Following Teams

India
England
NewZeland
SouthAfrica
Scotland


Example 2

<html>
<body>
<h2>Program to understand the working of for loop</h2>
<h3>Winner of ICC T20, 2021 is Chosen from the Following Teams</h3>
<script>
var team = ["India", "England", "NewZeland", "SouthAfrica", "Scotland"];
var winner = "";
var i;
winner += team[0] + "<br>";
winner += team[1] + "<br>";
winner += team[2] + "<br>";
winner += team[3] + "<br>";
winner += team[4] + "<br>";
document.write(winner);
</script>
</body>
</html>

Output

Program to understand the working of for loop

Winner of ICC T20, 2021 is Chosen from the Following Teams

India
England
NewZeland
SouthAfrica
Scotland


Example: Omission of “Loop Initialization” from for loop.

<html>
<body>
<h2>Program to understand the omission of Loop Initialization</h2>
<h3>Winner of ICC T20, 2021 is Chosen from the Following Teams</h3>
<script>
var team = ["India", "England", "NewZeland", "SouthAfrica", "Scotland"];
var winner = "";
var i = 0; // initialization is done outside of for loop
for (; i < 5; i++)
{
winner += team[i] + "<br>";
}
document.write(winner);
</script>
</body>
</html>

Output

Program to understand the omission of Loop Initialization

Winner of ICC T20, 2021 is Chosen from the Following Teams

India
England
NewZeland
SouthAfrica
Scotland


Example: Omission of “Loop Initialization” and “Loop Iteration” from for.

<html>
<body>
<h2>Program to understand the Omission of "Loop Initialization" and "Loop Iteration"</h2>
<h3>Winner of ICC T20, 2021 is Chosen from the Following Teams</h3>
<script>
var team = ["India", "England", "NewZeland", "SouthAfrica", "Scotland"];
var winner = "";
var i = 0;
for (; i < 5;)
{
winner += team[i] + "<br>";
i++;
}
document.write(winner);
</script>
</body>
</html>

Output

Program to understand the Omission of “Loop Initialization” and “Loop Iteration”

Winner of ICC T20, 2021 is Chosen from the Following Teams

India
England
NewZeland
SouthAfrica
Scotland


Audience

This JavaScript tutorial is designed to help the beginners as well as the professional developers. For better understanding the language of the tutorial is kept simple and easy to understand.

Prerequisites

This tutorial demands to have the basic knowledge of the programming languages such as c or c++, HTML for the better understanding of the JavaScript programming language. The other basic requirement to learn JavaScript through this tutorial is the basic knowledge of computer and information technology so you can easily acquire a better understanding JavaScript programming.

Community Helping

In case you find any kind of error like typing error, spelling mistakes, incorrect grammar, incorrect information or any other mistakes. Please feel free to write to us at: akyadav@etutororg.com.