Loops and Repetition

Repeating code manually is tedious. Loops do it automatically!

Why Use Loops?

Without loop:

javascript

console.log("Item 1");console.log("Item 2");console.log("Item 3");// ... and if there were 1000?

With loop:

javascript

for (let i = 1; i <= 1000; i++) {    console.log(`Item ${i}`);}

for - When You Know How Many Times

javascript

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

Structure:

javascript

for (initialization; condition; increment) {    // repeated code}

Initialization: let i = 0 - starting value
Condition: i < 5 - continues while true
Increment: i++ - changes i after each iteration

Common Examples

javascript

// Count to 10for (let i = 1; i <= 10; i++) {    console.log(i);} // Count backwardsfor (let i = 10; i >= 1; i--) {    console.log(i);} // Skip by 2for (let i = 0; i <= 10; i += 2) {    console.log(i); // 0, 2, 4, 6, 8, 10}

while - While Something Is True

javascript

let counter = 0; while (counter < 5) {    console.log(counter);    counter++;}

Use while when you don't know exactly how many times:

javascript

let password = ""; while (password !== "secret") {    password = prompt("Enter the password:");} alert("Correct password!");

do...while - Executes At Least Once

javascript

let number; do {    number = Number(prompt("Enter a number greater than 10:"));} while (number <= 10); console.log(`You entered ${number}`);

Difference: do...while always executes once, then checks.

Iterating Over Arrays

for classic

javascript

const fruits = ["apple", "banana", "orange"]; for (let i = 0; i < fruits.length; i++) {    console.log(fruits[i]);}

for...of (modern) ✅ Recommended

javascript

const fruits = ["apple", "banana", "orange"]; for (const fruit of fruits) {    console.log(fruit);}

forEach (method)

javascript

const fruits = ["apple", "banana", "orange"]; fruits.forEach(function(fruit) {    console.log(fruit);}); // With arrow functionfruits.forEach(fruit => console.log(fruit));

break and continue

break - Exits the loop

javascript

for (let i = 1; i <= 10; i++) {    if (i === 5) {        break; // exits when i is 5    }    console.log(i);}// Output: 1, 2, 3, 4

continue - Skips to next iteration

javascript

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

Nested Loops

javascript

// Multiplication tablefor (let i = 1; i <= 5; i++) {    for (let j = 1; j <= 5; j++) {        console.log(`${i} x ${j} = ${i * j}`);    }    console.log("---");}

Practical Exercise: Number Guessing Game

javascript

const secret = Math.floor(Math.random() * 100) + 1;let attempts = 0;let guess; while (guess !== secret) {    guess = Number(prompt("Guess a number (1-100):"));    attempts++;     if (guess < secret) {        alert("Higher!");    } else if (guess > secret) {        alert("Lower!");    }} alert(`Congratulations! You got it in ${attempts} attempts!`);

Summary

✅ for when you know how many times
✅ while when you don't know how many times
✅ for...of to iterate arrays
✅ break to exit, continue to skip
✅ Avoid infinite loops!

In the next lesson, we'll learn functions to organize code! 🚀