6. Loops - for, while, for...of, for...in
What Are Loops?
Loops let you run a block of code multiple times — for example, printing numbers 1 to 10, checking items in a list, or processing user data. Instead of writing repetitive code, loops automate repetition for you.
The for Loop
The classic `for` loop runs a fixed number of times. It includes three parts: **initialization**, **condition**, and **increment**.
for (let i = 1; i <= 5; i++) {
console.log("Count:", i);
}Here’s what happens: - `let i = 1` starts the loop counter. - `i <= 5` keeps the loop running while true. - `i++` increases `i` by 1 after each round.
The while Loop
A `while` loop runs as long as a condition is true — but be careful! If you never make the condition false, it’ll run forever.
let n = 1;
while (n <= 3) {
console.log("Step", n);
n++;
}This loop keeps running until `n` becomes greater than 3.
The do...while Loop
`do...while` is similar to `while`, but it always runs **at least once**, even if the condition is false at the start.
let count = 0;
do {
console.log("This runs once!");
count++;
} while (count < 0);The for...of Loop
`for...of` loops through **iterable** objects like arrays, strings, or sets — giving you direct access to their values.
const fruits = ["apple", "banana", "mango"];
for (const fruit of fruits) {
console.log(fruit);
}This prints each fruit in the array, one by one — perfect for looping through lists.
The for...in Loop
`for...in` is used for looping through **object properties** — giving you access to each key in the object.
const user = { name: "Ada", age: 25, country: "Nigeria" };
for (const key in user) {
console.log(key + ":", user[key]);
}This will print each property and its value — great for inspecting or displaying objects.
Loop Control: break and continue
Sometimes you need to **stop** a loop early or **skip** certain steps. That’s where `break` and `continue` come in:
for (let i = 1; i <= 5; i++) {
if (i === 3) continue; // Skip 3
if (i === 5) break; // Stop at 5
console.log(i);
}Mini Challenge
1. Use a `for` loop to print numbers from 10 down to 1. 2. Loop through an array of colors using `for...of`. 3. Loop through an object representing a person and log each key/value pair using `for...in`.
// Example:
for (let i = 10; i >= 1; i--) {
console.log(i);
}
const colors = ["mint", "coral", "charcoal"];
for (const color of colors) {
console.log(color);
}
const person = { name: "Chrise", country: "Nigeria", hobby: "coding" };
for (const key in person) {
console.log(key + ":", person[key]);
}Key Takeaway
Loops make repetition effortless — whether counting, iterating arrays, or exploring objects. Once you master them, you’ll rarely write repetitive code again.