Loops: Repeating Without Copy-Paste

From Bee: If your loop hangs the page, you have an infinite loop. The condition variable is not being updated. Stop the tab and check.

What Is a Loop?

A loop repeats a block of code. Two main shapes appear in every language:

• for — when you know how many times you want to repeat (e.g., "for each item in this list").
• while — when you stop on a condition (e.g., "until the user types quit").

For-of / For-in / Foreach

Modern languages provide cleaner ways to loop over collections without managing an index manually. Use them when you can — they're less error-prone than index-based loops.

Break and Continue

break exits the loop immediately. continue skips to the next iteration. Both are useful but overuse them and your loop becomes hard to follow.

Loop Visualizer

Pick a loop and step through it line by line. Watch i update and the console fill in.

Code Examples in Three Languages

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

// for-of (cleaner)
const names = ["Aisha", "Ben", "Chen"];
for (const name of names) {
  console.log(name);
}

// while
let count = 0;
while (count < 3) {
  console.log(count);
  count++;
}

// break / continue
for (let i = 0; i < 10; i++) {
  if (i === 5) break;       // stop at 5
  if (i % 2 === 0) continue; // skip evens
  console.log(i);            // 1, 3
}

# for over a range
for i in range(5):
    print(i)        # 0, 1, 2, 3, 4

# for over a list
names = ["Aisha", "Ben", "Chen"]
for name in names:
    print(name)

# while
count = 0
while count < 3:
    print(count)
    count += 1

# break / continue
for i in range(10):
    if i == 5:
        break
    if i % 2 == 0:
        continue
    print(i)

// Classic for
for (int i = 0; i < 5; i++) {
    System.out.println(i);
}

// Enhanced for (each)
String[] names = {"Aisha", "Ben", "Chen"};
for (String name : names) {
    System.out.println(name);
}

// while
int count = 0;
while (count < 3) {
    System.out.println(count);
    count++;
}

// break / continue work the same

Best Practices

1. Prefer for-of / for-each over manual index loops when you don't need the index.
2. Initialize loop variables right before the loop.
3. Make sure your loop has a clear exit — infinite loops freeze programs.
4. Avoid modifying a collection while looping over it.

Common Mistakes

• Off-by-one errors. < vs <= determines whether the last item is included.
• Infinite while loop. Forgetting to update the condition variable.
• Modifying the array while looping. Items get skipped or reprocessed.
• Reusing the same variable across nested loops. i outside, i inside — collision.

How It Works Under the Hood

A for loop compiles into a sequence: initialize, test, execute body, update, jump back to test. The CPU does this in a tight cycle that's extremely fast — modern CPUs run billions of simple-loop iterations per second.

for-of and forEach add a layer of abstraction. They use the language's iterator protocol (Symbol.iterator in JS, __iter__ in Python). Iterators let you loop over things that aren't arrays — generators, streams, ranges, infinite sequences — using the same syntax.

This is why for (const line of fileStream) {} works in modern Node: the file stream implements the iterator protocol and yields one line at a time without ever loading the whole file.

From Beginner to Pro

The same concept gets deeper as you grow. Here's what mastery looks like at three levels:

Performance & Gotchas

• Off-by-one with < vs <=.
• Modifying the collection during iteration — splice removes shift indexes.
• Closure-in-loop with var (legacy JS) — all callbacks see the final value.
• Infinite while loops — usually a missing increment or a condition that never flips.

Quick Quiz

Real-World Uses (Production Code, Today)

Frequently Asked Questions

Related Concepts