Loops in JavaScript

Loops allow you to repeat a block of code multiple times.
Instead of writing the same code again and again, you write it once inside a loop.

Loops are used in almost every program:

• Printing values

• Processing arrays

• Performing repeated calculations

• Reading data from APIs

• Creating patterns

• Validating inputs

Understanding loops is very important to become good at JavaScript.

In this chapter, you will learn:

• Why loops are needed

• Types of loops

• How each loop works

• Examples for beginners

Let’s begin with a simple explanation.

Why Do We Need Loops?

Imagine you want to print numbers from 1 to 10.

Without loops:

console.log(1);
console.log(2);
console.log(3);
// ...
console.log(10);

With a loop:

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

Cleaner, shorter, and scalable.

Types of Loops in JavaScript

1. for loop

2. while loop

3. do...while loop

4. for...of loop (learned earlier)

5. for...in loop (learned earlier)

In this chapter, we will focus on the main three loops:

• for

• while

• do...while

1. for Loop

Best when you know how many times you want to repeat something.

Syntax:

for (initial; condition; update) {
    // code
}

Example: Print 1 to 5

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

Output:

1
2
3
4
5

Example: Print even numbers

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

Output:

2
4
6
8
10

2. while Loop

Used when the number of repeats is not known beforehand.

Syntax:

while (condition) {
    // code
}

Example: Print 1 to 5

let i = 1;

while (i <= 5) {
    console.log(i);
    i++;
}

Output:

1
2
3**
4  
5

Example: Keep asking until input is valid (simulation)

let count = 0;

while (count < 3) {
    console.log("Attempt:", count);
    count++;
}

3. do...while Loop

The do...while loop runs at least once, even if the condition is false.

Syntax:

do {
    // code
} while (condition);

Example:

let num = 1;

do {
    console.log(num);
    num++;
} while (num <= 5);

Output:

1
2
3
4
5

Example: Condition false but code runs once

let x = 10;

do {
    console.log("This will run once");
} while (x < 5);

Output:

This will run once

Infinite Loops (Important Warning)

This happens when the condition never becomes false.

while (true) {
    console.log("infinite loop");
}

Avoid infinite loops — they can crash your program.

Looping Backwards

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

Output:

5
4
3
2
1

Looping Through Arrays (Preview)

let fruits = ["apple", "banana", "mango"];

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

Output:

apple
banana
mango

Real-Life Example: Printing a Table

let n = 5;

for (let i = 1; i <= 10; i++) {
    console.log(n + " x " + i + " = " + (n * i));
}

Output:

5 x 1 = 5
5 x 2 = 10
...
5 x 10 = 50

Real-Life Example: Count Even Numbers From List

let nums = [1, 4, 7, 10, 12];

let count = 0;

for (let n of nums) {
    if (n % 2 === 0) {
        count++;
    }
}

console.log("Total evens:", count);

Output:

Total evens: 3

Common Mistakes Beginners Make

1. Forgetting to update the loop variable

2. Writing conditions that never become false

3. Using <= instead of < (or vice versa)

4. Off-by-one errors

5. Using for loop when while is easier

Example Program (Complete)

let sum = 0;

for (let i = 1; i <= 5; i++) {
    sum += i;
}

console.log("Sum =", sum);

Output:

Sum = 15