Trace a for Loop

A for loop initializes once, checks before each body execution and updates afterward. A roll-number range includes its upper endpoint only when its comparison allows that endpoint.

Before this topic, review Choose a Loop if its terms are unfamiliar.

This is JavaScript using language features and the host console. Read the initial values, then follow each operation to its displayed result. A declaration names a value, a function call performs an operation, and console.log displays its arguments.

The for loop in JavaScript is a fundamental building block that allows you to run a block of code multiple times. It's like telling the browser, “Do this task again and again — but under my conditions.” Whether you're processing arrays, printing numbers, or building logic for games, the for loop is your go-to structure.

for (initialization; condition; increment) {
    // code block to be executed
}

Explanation of each part:

• initialization – typically used to set a counter variable.
• condition – defines how long the loop should run.
• increment – updates the counter each time the loop runs.

for (let i = 1; i <= 5; i++) {
    console.log(i);
}

1
2
3
4
5

The loop starts with i = 1, checks if i <= 5, then executes the console.log(i). After that, i increases by 1. This continues until the condition is false.

let n = 5;
let sum = 0;

for (let i = 1; i <= n; i++) {
    sum += i;
}
console.log("Sum:", sum);

Sum: 15

Looping through arrays is where the for loop becomes essential.

const fruits = ["apple", "banana", "cherry"];

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

apple
banana
cherry

for (let i = 1; i <= 10; i++) {
    if (i % 2 === 0) {
        console.log(i);
    }
}

2
4
6
8
10

What if you need to loop within a loop? That’s where nested for loops come in.

for (let i = 1; i <= 3; i++) {
    for (let j = 1; j <= 2; j++) {
        console.log(`i = ${i}, j = ${j}`);
    }
}

i = 1, j = 1
i = 1, j = 2
i = 2, j = 1
i = 2, j = 2
i = 3, j = 1
i = 3, j = 2

You can also run the loop backward:

for (let i = 5; i >= 1; i--) {
    console.log(i);
}

5
4
3
2
1

Break Statement

Stops the loop when a certain condition is met.

for (let i = 1; i <= 10; i++) {
    if (i === 6) break;
    console.log(i);
}

1
2
3
4
5

Continue Statement

Skips the current iteration and continues with the next one.

for (let i = 1; i <= 5; i++) {
    if (i === 3) continue;
    console.log(i);
}

1
2
4
5

let number = 4;
for (let i = 1; i <= 10; i++) {
    console.log(`${number} x ${i} = ${number * i}`);
}

4 x 1 = 4
4 x 2 = 8
4 x 3 = 12
4 x 4 = 16
4 x 5 = 20
4 x 6 = 24
4 x 7 = 28
4 x 8 = 32
4 x 9 = 36
4 x 10 = 40

• Use let or const instead of var to declare loop counters.
• When working with arrays, prefer for...of or forEach() if mutation or index isn’t needed.
• Avoid deeply nested loops if possible — they affect performance and readability.

The for loop is a powerhouse in JavaScript — compact, flexible, and indispensable. From printing simple sequences to handling complex nested structures, it gives you direct control over the flow. Understanding its syntax and behavior is key to writing clean and efficient code.

With roll < 3, the final roll is excluded. continue still reaches a for loop's update, while break exits the loop.

Your task: Replace <= 3 with <= 2. Predict the result before running the edited program.

The source is repeated here. If the edit targets the HTML rather than the script, use the markup repeated below; the worked answer also repeats the changed markup.

The condition rejects roll 3 before the body runs.

A for loop initializes once, checks before each body execution and updates afterward. A roll-number range includes its upper endpoint only when its comparison allows that endpoint.

Check your variation against this explanation: The condition rejects roll 3 before the body runs.

Use the JavaScript array reference library for individual array operations and boundary tests to check a rule independently.