For Loop0%
While and Do-While Loops

For Loop

Beginner12 min read•Updated: Jul 11, 2026
Study Materials

For Loop in JavaScript

Loops are programming constructs used to repeat a block of code multiple times until a specific condition is met. The classic for loop is the most versatile and widely used counting loop in JavaScript.

1. Anatomy of the Standard for Loop

A standard for loop consists of three expressions separated by semicolons:

Output
for (initialization; condition; increment/decrement) {
// Code executed repeatedly while condition is true
}
JavaScript
for (let i = 0; i < 5; i++) {
console.log(`Iteration: ${i}`);
}

Execution Step-by-Step:

  1. 1
    Initialization (let i = 0): Executes once before the loop begins. Sets up the counter variable.
  2. 2
    Condition (i < 5): Evaluated before every iteration. If truthy, the loop body runs; if falsy, the loop terminates.
  3. 3
    Loop Body (console.log(...)): The code inside { ... } executes.
  4. 4
    Increment (i++): Executes after the loop body. The counter increments and execution returns to Step 2.

2. Practical Use Cases for for Loops

A. Iterating Over an Array by Index

JavaScript
const frameworks = ["React", "Vue", "Angular", "Next.js"];
 
for (let i = 0; i < frameworks.length; i++) {
console.log(`Index ${i}: ${frameworks[i]}`);
}

B. Counting Down (Reverse Loop)

JavaScript
for (let i = 10; i >= 1; i--) {
console.log(`Blastoff in: ${i}...`);
}
console.log("Lift off! 🚀");

C. Stepping by Increments Other Than 1

JavaScript
// Even numbers up to 10:
for (let i = 2; i <= 10; i += 2) {
console.log(i); // 2, 4, 6, 8, 10
}

3. Nested for Loops

You can place loops inside loops (for example, traversing a 2D matrix or multiplication table):

JavaScript
for (let i = 1; i <= 3; i++) {
for (let j = 1; j <= 3; j++) {
console.log(`${i} * ${j} = ${i * j}`);
}
}
Important Warning
[!WARNING] Performance Alert: A nested loop with $N$ iterations inside a loop with $N$ iterations runs $N^2$ times ($O(N^2)$ time complexity). Keep nested loops shallow on large datasets!

4. The Infinite Loop Danger

If the condition never evaluates to false, the loop will run forever, consuming 100% CPU and crashing the browser tab:

JavaScript
// ❌ CRASH DANGER: i will never be less than 0!
for (let i = 0; i >= 0; i++) {
// Freezes the browser!
}
Interactive Quiz

Practice Quiz

Question 1
What are the three parts of a standard for loop header separated by semicolons?
Question 2
How many times does the loop for (let i = 0; i < 4; i++) execute?
Question 3
How do you loop through an array items backward from the last element to the first?
Question 4
What happens if the continuation condition in a for loop is omitted (e.g. for (;;) )?
Question 5
Why is let preferred over var when declaring the loop counter i?
Next Lesson

While and Do-While Loops

Continue learning with hands-on practice, examples, and exercises in the upcoming topic.

Related Lessons

Previous LessonNext Lesson
Truthy & Falsy ValuesWhile and Do-While Loops

Practice Quiz

Test your understanding of this lesson with 5 questions. Each question has one correct answer.

PreviousNext
PrevNext