For loop in JavaScript

In this post,we are going to explore for loop in JavaScript with example.

What is JavaScript for loop


The JavaScript for loop executes a block of code until the condition is true and includes three expressions and code statements (known as loop body). We use a continue statement to move to the next item and use a break statement to end the loop.

Syntax for JavaScript for loop

for ([initialization]); [condition]; [final-expression]) 
{
   // statements
}
  • initialization: The initialization expression, executes only once, it is used to initialize the counter variable. The counter variable has scope to the loop only. once the loop terminates the scope of the variable terminates.
  • condition: The condition expression evaluates true before every iteration. The loop statement is executed only if the conditions are true else loop terminates if the condition is false.
  • final-expression: This expression is run after every iteration is used to increment/decrement a counter.
  • Statements: The code inside the loop body execute every loop iteration.

Important note :

  • The for loop three expressions are optional. We can omit all of them as shown in below example
for( ; ;)
{
 //statements
}
  • var can be used to declare and initialize variables in for loop, in this case, the scope of initializing variable will be global mean can be accessed outside the loop body.
  • let keyword can be used to declare and initialize variable its scope is local to loop. if we try to access the initialized variable outside the loop body it will throw an error.

In the below example, we are using var to declare and initialize index variable, its scope is global. We can access it outside the loop as shown in the example.

let myarray = [10, 20, 30];

console.log('Loop over array elements:')

for(var index =0;index<myarray.length;index++)
{
console.log(myarray[index]);
}

console.log('out side the loop value of index :',index);

Output

Loop over array elements:
10
20
30
out side the loop value of index : 3

JavaScript for loop examples


1. JavaScript For loop over array element

In this example, we are using the let keyword to declare and initialize the variable in for loop.

  • First, We are declaring a variable index and initialize it to 0.
  • We are running loop till myarray.length.
  • We are printing the value of the array element in the Console window.
  • We are checking the condition and incrementing the value of the index by one in each iteration.
//Use JavaScript for loop to iterate over array

let myarray = [10, 20, 30, 40, 20, 10];

console.log('Loop over array elements:')

for(let index =0;index<myarray.length;index++)
{
console.log(myarray[index]);
}

Output

Loop over array elements:
10
20
30
40
20
10

Example of JavaScript For loop’s without initialization part

The for loop can be used with any of three expressions. In this example, we will understand the omission of the initialization part.

let  index =0

for(;index<3;index++)
{
console.log(index);
}


Output

0
1
2

Example of For loop without the loop body

The JavaScript for loop can have the empty statement for this we place a semicolon(;) right after the for statement. In this example, we are calculating the multiply of numbers 1 to 3 by vomiting the for loop body.

let mutiply = 1;
for (let i = 1; i <= 3; i++, mutiply *= i);
console.log(mutiply);

Output

multiply: 24

Example of For loop with break statement

In this example, we are learning how to use break statements with JavaScript for loop. The break statement is used to terminate the loop. We are terminating the loop when the value of variable i is equal to 5.

for (let i = 1; i <= 10; i++)
{
 if (i === 5) { break; }
console.log('Number is :',i);
}

Output

Number is : 1
Number is : 2
Number is : 3
Number is : 4

Example of For loop with continue statement

In this example we are using the continue statement with for loop.

for (let i = 1; i <= 5; i++)
{
 if (i === 3) { continue; }
console.log('Number is :',i);
}


Output

Number is : 1
Number is : 2
Number is : 4
Number is : 5

Summary :

In this post, we have explored what is For loop in JavaScript, how to use for loop to iterate over the array elements, how to omit any expression in for loop statement, and how to use the break and continue statement with JavaScript for a loop.