Open In App

JavaScript For Loop

Improve
Improve
Improve
Like Article
Like
Save Article
Save
Share
Report issue
Report

Looping in programming languages is a feature that facilitates the execution of code blocks repeatedly until some condition becomes false. In this article, we will cover for loop which provides a brief and systematic way of writing the loop structure.

For Loop in JavaScript

The for loop runs until the given condition becomes false. It is similar to the for loops in C++ and Java.

JavaScript for loop is used to iterate the elements/code block a fixed number of times. It is used if the number of the iteration is known.

for statement creates the loop that accepts three optional expressions and a code block that will be executed in a loop. The syntax of for statement is given below.

Syntax:

for (statement 1 ; statement 2 ; statement 3){
code here...
}
  • Statement 1: It is the initialization of the counter. It is executed once before the execution of the code block.
  • Statement 2: It defines the testing condition for executing the code block
  • Statement 3: It is the increment or decrement of the counter & executed (every time) after the code block has been executed.

Example:

javascript




// JavaScript program to illustrate for loop
let x;
 
// for loop begins when x=2
// and runs till x <=4
for (x = 2; x <= 4; x++) {
    console.log("Value of x:" + x);
}


Output:

Value of x:2
Value of x:3
Value of x:4

Flow chart

This flowchart shows the working of the for loop in JavaScript. You can see the control flow in the For loop.

for loop flow chart

Statement 1: Initializing Counter Variable

Statement 1 is used to initialize the counter variable. A counter variable is used to keep track of the number of iterations in the loop. You can initialize multiple counter variables in statement 1.

We can initialize the counter variable externally rather than in statement 1. This shows us clearly that statement 1 is optional. We can leave the portion empty with a semicolon. 

Example:

javascript




let x = 2;
 
for (; x <= 4; x++) {
    console.log("Value of x:" + x);
}


Output

Value of x:2
Value of x:3
Value of x:4

Statement 2: Testing Condition

This statement checks the boolean value of the testing condition. If the testing condition is true, the for loop will execute further, otherwise loop will end and the code outside the loop will be executed. It is executed every time the for loop runs before the loop enters its body.

This is also an optional statement and Javascript treats it as true if left blank. If this statement is omitted, the loop runs indefinitely if the loop control isn’t broken using the break statement. It is explained below in the example.

Example:

Javascript




let x = 2;
for (; ; x++) {
    console.log("Value of x:" + x);
    break;
}


Output:

Value of x:2

Statement 3: Updating Counter Variable

It is a controlled statement that controls the increment/decrement of the counter variable.

It is also optional by nature and can be done inside the loop body.

Example:

Javascript




const subjects = ["Maths", "Science", "Polity", "History"];
let i = 0;
let len = subjects.length;
let gfg = "";
for (; i < len;) {
    gfg += subjects[i];
    //can be increased inside loop
    i++;
}
console.log(gfg)


Output

MathsSciencePolityHistory

More Loops in JavaScript

JavaScript has different kinds of loops in Java. Some of the loops are:

Loop Description
for loop A loop that repeats a block of code a specific number of times based on a conditional expression.
while loop A loop that repeats a block of code as long as a specified condition is true.
do-while loop A loop that executes a block of code at least once, then repeats the block as long as a specified condition is true.
for…of loop Iterates over the values of an iterable object (like arrays, strings, maps, sets, etc.)
for…in loop Iterates over the enumerable properties of an object (including inherited properties).

Learn and master JavaScript with Practice Questions. JavaScript Exercises provides many JavaScript Exercise questions to practice and test your JavaScript skills.



Last Updated : 08 Mar, 2024
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads