Skip to content

The while Loop

The for loop is ideal when you know how many times to iterate — loop through this array, count from 0 to 9. The while loop is for when you do not know in advance: keep running until something changes.

while (condition) {
// body
}

The condition is checked before each iteration. If it is truthy, the body runs. If it is falsy, the loop exits. If it starts falsy, the body never runs at all.

let seatsLeft = 3;
while (seatsLeft > 0) {
console.log(`Seat booked! Seats remaining: ${seatsLeft}`);
seatsLeft--;
}
console.log('Tour fully booked.');
// Seat booked! Seats remaining: 3
// Seat booked! Seats remaining: 2
// Seat booked! Seats remaining: 1
// Tour fully booked.
Use for whenUse while when
You know the number of iterationsThe iteration count is unknown
Iterating over an array or a rangeLooping until a condition changes
The counter is the key variableThe loop variable is state, not a counter

In practice, most iteration over arrays uses for or for...of. while appears when you are waiting for something — a user action, a queue to drain, a value to change.

If the condition never becomes false, the loop runs forever. The browser tab freezes and eventually crashes.

let count = 0;
while (count < 5) {
console.log(count);
// BUG: forgot count++ — count never changes, condition never becomes false
}

Every while loop needs a clear path to a false condition:

  • The variable in the condition must change inside the body
  • Or a break statement must eventually exit the loop

Before writing a while loop, ask yourself: what makes the condition false? If the answer is unclear, the loop is a bug waiting to happen.

break exits a while loop immediately, just as it does in a for loop:

let seatsLeft = 10;
let booked = 0;
while (true) { // deliberate infinite loop
if (booked >= 5) {
break; // exit condition inside the body
}
booked++;
seatsLeft--;
console.log(`Booked: ${booked}`);
}

while (true) with an interior break is a recognizable pattern for loops where the exit condition is complex or checked mid-body. Use it deliberately, not by accident.

do...while runs the body at least once before checking the condition:

let attempts = 0;
do {
console.log(`Attempt ${attempts + 1}`);
attempts++;
} while (attempts < 3);
// Attempt 1
// Attempt 2
// Attempt 3

The body executes first, then the condition is evaluated. If the condition is immediately false, the body still ran once. This is useful when the first execution must happen regardless — prompting a user for input, for example, where you always need at least one attempt.

In practice, do...while is less common than while. Know it exists; reach for it when you genuinely need the body to run at least once.

Simulate a booking countdown for an STO tour:

let seatsLeft = 5;
while (seatsLeft > 0) {
console.log(`Seat booked! Seats remaining: ${seatsLeft}`);
seatsLeft--;
}
console.log('Tour fully booked.');

Then modify it to break early when seatsLeft === 3 (simulating a system pause) and observe which logs appear. After that, deliberately comment out seatsLeft-- to trigger an infinite loop — then immediately restore it.

  • while (condition) runs the body as long as the condition is truthy. If the condition starts false, the body never runs.
  • Use while when the number of iterations is unknown; use for when iterating a known count or collection.
  • The infinite loop: if the condition never becomes false, the browser tab freezes. Every while loop needs a clear exit.
  • break exits a while loop immediately, just as it does in a for loop.
  • do...while runs the body at least once before checking — useful when the first iteration must always happen.