Loops

What you'll learn

How to repeat an action many times with a for loop and a while loop.

Why it matters

Printing 100 names, adding up a list of prices, retrying a request: all of these are repetition. Loops let you write the instruction once.

Explanation

A for loop has three parts in its parentheses:

• start runs once, usually let i = 0.
• keepGoingWhile is checked before every round. When it is false the loop stops.
• afterEachRound runs at the end of each round, usually i++ (add one).

A while loop repeats as long as its condition is true. Use it when you do not know in advance how many rounds you need.

Example

Step-by-step walkthrough

1. The for loop starts with i = 1.
2. It checks 1 <= 3, true, so it prints Round 1, then i++ makes i 2.
3. It repeats for Round 2 and Round 3. When i is 4, 4 <= 3 is false and the loop ends.
4. The while loop adds n to total each round: 1, 3, 6, 10, 15.
5. After n becomes 6 the condition fails, and it prints Sum 1 to 5 is 15.

Try it yourself

Change the loop so it counts from 1 to 10. Then make it print only the even numbers (hint: i % 2 === 0).

Counting loopJavaScript

Editable codefor (let i = 1; i <= 3; i++) { console.log("Round " + i); }

Run ResetCopyCtrl+Enter to run

Common mistakes

• Off-by-one errors. i < 3 runs 3 times starting at 0, i <= 3 runs 4 times.
• Forgetting i++ in a while loop, which creates an infinite loop.
• Using const for the counter. The counter changes, so use let.
• Changing the loop variable inside the body by accident.

Quick quiz

Summary

• for repeats a set number of times; while repeats until a condition fails.
• Always make sure the loop can end.
• Use let for the counter.

Next: packaging code into functions.

for (start; keepGoingWhile; afterEachRound) { ... }

for (let i = 1; i <= 3; i++) {
  console.log("Round " + i);
}

let total = 0;
let n = 1;
while (n <= 5) {
  total = total + n;
  n++;
}
console.log("Sum 1 to 5 is " + total);