Chapter V · Control Flow

The for Loop

The for loop repeats a block a set number of times, packing the counter's setup, condition, and update into one line so the whole loop's behavior is visible at a glance.

01 What Is the for Loop?

A for loop has three parts inside its parentheses, separated by semicolons: an initialization (runs once, before anything else), a condition (checked before every iteration), and an update (runs after every iteration). It's the standard choice whenever the number of repetitions — or a counter driving them — is known in advance.

02 Simple Example

Counting from 0 to 2.

for.js
for (let i = 0; i < 3; i++) {\n  console.log("Iteration:", i);\n}\n// 0, 1, 2

i is created once, checked before each pass, and incremented after each pass — the loop stops the moment i reaches 3, since 3 < 3 is false.

03 How It Works

Each of the three clauses runs at a specific, fixed moment: initialization exactly once at the very start, the condition before every single iteration including the first, and the update after every iteration's body finishes but before the condition is checked again.

let i = 0 i < 3? Run body i++ exit yes no

Initialization runs once; condition and update repeat every cycle until the condition fails.

04 Step-by-Step

  1. Run the initialization expression once (e.g. let i = 0).

  2. Check the condition. If false, exit the loop immediately without running the body.

  3. If true, run the loop body.

  4. Run the update expression (e.g. i++).

  5. Return to step 2 and repeat.

05 Practical Example

Looping over an array by index.

array-for.js
const fruits = ["apple", "banana", "cherry"];\n\nfor (let i = 0; i < fruits.length; i++) {\n  console.log(fruits[i]);\n}

06 Common Mistakes & Edge Cases

Warning: Using var instead of let for the counter used to be standard, but it means every closure created inside the loop shares one variable — a classic source of bugs. let creates a fresh binding per iteration, which is why it's the modern default.

Off-by-one errors. i <= fruits.length would read one index past the array's end, returning undefined; the standard, correct bound is i < fruits.length.

For simply iterating values (not indexes), a for...of loop or array method is usually more readable than a classic for.

07 Mental Model

"Running laps: set the counter, check if laps remain, run one, then count it and check again."

08 Interview Questions

Q: What happens if the initialization uses var vs let?

With var, one variable is shared across all iterations; with let, a brand-new binding is created for each iteration — this matters most when closures capture the loop variable, e.g. inside setTimeout.

Q: Can any of the three clauses be omitted?

Yes — for (;;) is a valid infinite loop with all three clauses empty, as long as something inside the body eventually breaks out of it.

Key Takeaway

A for loop bundles setup, condition, and update into one line, running the condition check before every iteration — reach for it whenever a counter or a known number of repetitions drives the loop.

Related Concepts