Lesson 21 of 30 – JavaScript For Loop
56%

JavaScript For Loop

JavaScript includes the for loop to execute a block of code repeatedly. It is one of the most commonly used loops in programming.

Note: A for loop is useful when you know in advance how many times the code should execute.
What is a For Loop?

The for loop repeatedly executes a block of code until a specified condition becomes false.

It is commonly used for counting, displaying data, and traversing arrays.

Structure of a For Loop

A for loop contains three important parts:

  • Initialization – Starting value of the counter.
  • Condition – Checks whether the loop should continue.
  • Iteration – Increases or decreases the counter.
Syntax:
for(initialization; condition; iteration){
  // code here
}
Simple For Loop Example
Example:
for(var i=0; i<6; i++){
document.write(i + " ");
}
Output:

0 1 2 3 4 5

How the Loop Works
Part Description
var i=0 Initializes the counter
i<6 Checks the condition
i++ Increases counter by 1
Displaying Numbers 1 to 10
Example:
for(var i=1; i<=10; i++){
document.write(i + "<br>");
}
Output:

1 2 3 4 5 6 7 8 9 10

For Loop with Array

The for loop is commonly used to access array elements.

Example:
var arr=[20,21,22,23,24];

for(var i=0;i<arr.length;i++){
document.write(arr[i] + "<br>");
}
Output:

20
21
22
23
24

Looping Through Student Names

A for loop can display multiple values stored in an array.

Example:
var students=["Aman","Ravi","Priya","Neha"];

for(var i=0;i<students.length;i++){
document.write(students[i] + "<br>");
}
Output:

Aman
Ravi
Priya
Neha

Reverse Counting

A for loop can also count backwards.

Example:
for(var i=10;i>=1;i--){
document.write(i + " ");
}
Output:

10 9 8 7 6 5 4 3 2 1

Infinite Loop Warning

If the condition never becomes false, the loop runs forever.

Example:
for(var i=1; i>0; i++){
document.write(i);
}

⚠ Avoid infinite loops because they can freeze the browser.

Using break Statement

The break statement immediately stops the loop.

Example:
for(var i=1;i<=10;i++){
if(i==6){
break;
}
document.write(i + " ");
}
Output:

1 2 3 4 5

Using continue Statement

The continue statement skips the current iteration.

Example:
for(var i=1;i<=5;i++){
if(i==3){
continue;
}
document.write(i + " ");
}
Output:

1 2 4 5

For Loop Without Initialization

Initialization can be written outside the loop.

Example:
var i=1;

for(;i<=5;i++){
document.write(i + " ");
}
Output:

1 2 3 4 5

For Loop Without Condition

The condition can be controlled inside the loop using break.

Example:
var i=1;

for(;;){
if(i>5) break;
document.write(i + " ");
i++;
}
Output:

1 2 3 4 5

Real-Life Example

Displaying attendance numbers of students.

Example:
for(var roll=1; roll<=5; roll++){
document.write("Student Roll No: " + roll + "<br>");
}
Advantages of For Loop
  • Reduces repetitive code.
  • Improves program efficiency.
  • Useful for arrays and collections.
  • Easy to control iterations.
  • Makes code cleaner and shorter.
  • Supports break and continue statements.
Points to Remember
  • JavaScript for loop executes code repeatedly.
  • It contains initialization, condition, and iteration.
  • The condition must eventually become false.
  • Use break to stop a loop.
  • Use continue to skip an iteration.
  • for loops are commonly used with arrays.
  • Avoid infinite loops.
Quick Revision
Part Purpose
Initialization Starting value
Condition Controls loop execution
Iteration Updates counter value
break Stops loop
continue Skips current iteration
Best Practices
  • Use meaningful loop variables.
  • Prefer arr.length instead of fixed numbers.
  • Avoid unnecessary nested loops.
  • Keep loop conditions simple.
  • Use break only when required.
  • Write readable and properly indented code.

🧠 Quick Quiz

Which part of a for loop checks whether the loop should continue?