Loops

During busy times, there’s a waiting list for customers who need to speak to the phone store employee. While there’s still people on that list, she just needs to keep serving the next customer.

Repeating a set of actions until a certain condition fails — in other words, repeating only while the condition holds — is the job of programming loops; loops can take different forms, but they all satisfy this basic behavior.

A loop includes the test condition as well as a block (typically as { .. }). Each time the loop block executes, that’s called an iteration.

For example, the while loop and the do..while loop forms illustrate the concept of repeating a block of statements until a condition no longer evaluates to true:

while (numOfCustomers > 0) {
    console.log( "How may I help you?" );
    // help the customer...
    numOfCustomers = numOfCustomers - 1;
}
// versus:
do {
    console.log( "How may I help you?" );
    // help the customer...
    numOfCustomers = numOfCustomers - 1;
} while (numOfCustomers > 0);

The only practical difference between these loops is whether the conditional is tested before the first iteration (while) or after the first iteration (do..while).

In either form, if the conditional tests as false, the next iteration will not run. That means if the condition is initially false, a while loop will never run, but a do..while loop will run just the first time.

Sometimes you are looping for the intended purpose of counting a certain set of numbers, like from 0 to 9 (ten numbers). You can do that by setting a loop iteration variable like i at value 0 and incrementing it by 1 each iteration.

Warning: For a variety of historical reasons, programming languages almost always count things in a zero-based fashion, meaning starting with 0 instead of 1. If you’re not familiar with that mode of thinking, it can be quite confusing at first. Take some time to practice counting starting with 0 to become more comfortable with it!

The conditional is tested on each iteration, much as if there is an implied if statement inside the loop.

We can use JavaScript’s break statement to stop a loop. Also, we can observe that it’s awfully easy to create a loop that would otherwise run forever without a breaking mechanism.

Let’s illustrate:

var i = 0;
// a `while..true` loop would run forever, right?
while (true) {
    // stop the loop?
    if ((i <= 9) === false) {
        break;
    }
    console.log( i );
    i = i + 1;
}
// 0 1 2 3 4 5 6 7 8 9

Warning: This is not necessarily a practical form you’d want to use for your loops. It’s presented here for illustration purposes only.

While a while (or do..while) can accomplish the task manually, there’s another syntactic form called a for loop for just that purpose:

for (var i = 0; i <= 9; i = i + 1) {
    console.log( i );
}
// 0 1 2 3 4 5 6 7 8 9

As you can see, in both cases the conditional i <= 9 is true for the first 10 iterations (i of values 0 through 9) of either loop form, but becomes false once i is value 10.

The for loop has three clauses: the initialization clause (var i=0), the conditional test clause (i <= 9), and the update clause (i = i + 1). So if you’re going to do counting with your loop iterations, for is a more compact and often easier form to understand and write.

There are other specialized loop forms that are intended to iterate over specific values, such as the properties of an object (see Chapter 2) where the implied conditional test is just whether all the properties have been processed. The “loop until a condition fails” concept holds no matter what the form of the loop.