JavaScript for loop: iterate arrays by index

The JavaScript for loop repeats a block of code a controlled number of times using three expressions: initialization, condition, and update. Use it when you need the loop index — to access array positions, compare neighbors, or count iterations. Unlike forEach or for...of, the classic JavaScript for statement gives direct control over start, end, and step values.

JavaScript For Loop Example For Array Iteration

Output:

Step 0: build
Step 1: test
Step 2: deploy

How This Example Works

1. let i = 0 creates a block-scoped counter starting at the first array index.
2. i < tasks.length checks the condition before each iteration — the loop stops when i reaches tasks.length, preventing an out-of-bounds read.
3. i++ increments the counter after each iteration body completes.
4. tasks[i] reads the element at position i, pairing each value with its index.

The < length bound (not <=) is the standard pattern because array indexes run from 0 to length - 1.

Common Mistakes in JavaScript for Loops

Off-by-one with <=

Wrong:

const items = ["a", "b", "c"];
for (let i = 0; i <= items.length; i++) {
  console.log(items[i]);
}

Right:

const items = ["a", "b", "c"];
for (let i = 0; i < items.length; i++) {
  console.log(items[i]);
}

<= runs one extra iteration, so items[items.length] is undefined.

Using var in async callbacks

Wrong:

for (var i = 0; i < 3; i++) {
  setTimeout(() => console.log(i), 0);
}
// logs: 3, 3, 3

Right:

for (let i = 0; i < 3; i++) {
  setTimeout(() => console.log(i), 0);
}
// logs: 0, 1, 2

var is function-scoped, so the callbacks read the final i. let creates a new binding per iteration.

for Loop vs for…of

Reach for for...of by default; switch to a classic for loop when you need the index or non-sequential stepping.

More Examples

Exit early with break:

const temps = [22, 18, 35, 29];
for (let i = 0; i < temps.length; i++) {
  if (temps[i] > 30) {
    console.log("First hot day at index", i);
    break;
  }
}

break stops the loop immediately. Without it, the loop would continue checking every remaining element after finding the first match.

Skip iterations with continue:

for (let i = 0; i < 5; i++) {
  if (i === 2) continue;
  console.log(i);
}
// 0, 1, 3, 4

continue skips the rest of the current iteration body but still runs the update expression (i++) before the next condition check.

FAQ

What is the syntax of a JavaScript for loop?

A JavaScript for statement has three optional expressions: for (init; condition; update). The init runs once before the loop starts, the condition is evaluated before each iteration, and the update runs after each iteration body. All three are optional — omitting the condition creates an infinite loop that must be exited with break.

JavaScript while for loop: when to use which?

Use a for loop when initialization, condition, and update all relate to the same counter — grouping them in one line makes the loop bounds immediately visible. Use while when the exit condition depends on external state or when setup and update logic belongs in the loop body rather than the header.

How do you stop a JavaScript for loop early?

Place a break statement inside the loop body. When the engine hits break, it exits the loop immediately and continues execution after the closing brace. Combine break with a condition to stop as soon as a target value is found, avoiding unnecessary iterations.