The break/continue Statements

Sometimes within for or while loops it may not be necessary to wait for the conditional expression to be satisfied. You might need to jump out of the loop before it is finished. Your script, for example, might perform a look-up through a list of 1,000 items to find a match. If, however, it finds the match on the first item, it would not be necessary to continue looking at the other 999 items. You would want to break out of the loop and process the found item.

The break Statement

For cases like this, you can use the break statement to exit a loop. This statement is placed inside the loop and is executed if some condition - short of the loop ending naturally - is met. Below is an example of a break statement appearing inside a for loop.

function showBeer() {
  for (i = 99; i >= 1; i--) {
    var moreBeer = confirm(
      "THE BEER SONG\n\n" +
      i + " bottles of beer on the wall,\n" + 
      i + " bottles of beer.\n" + 
      "Take one down and pass it around.\n" + 
      (i - 1) + " bottles of beer on the wall.\n\n" + 
      "See more beer?");
    if (moreBeer == false) {
      break;
    }
  }
}

function init() {
  var showBeerBtn = document.getElementById("showBeerBtn");
  showBeerBtn.onclick=showBeer;
}

window.onload=init;

<input type="button" value="99 Bottles of Beer" id="showBeerBtn" />

Listing 5-9. Code to break out of a for loop.

The for loop is set up to count down from 99 to 1. Each iteration through the loop displays a confirm dialog box announcing the count and asking the user whether or not to continue with the processing. The confirm statement returns the value true or false depending on whether the user clicks the "OK" button (true) or the "Cancel" button (false). The if statement checks the button click. If the "OK" button is clicked, the loop continues; if the "Cancel" button is clicked, the break command is executed. This statement causes script control to immediately exit the for loop without it reaching its natural end.

The continue Statement

A continue statement is the reverse of the break statement. It immediately skips back to the start of a loop, avoiding a natural end of the loop. Its use is illustrated below in a rewrite of the previous script.

function showBeer() {
  for (i = 99; i >= 1; i--) {
    var moreBeer = confirm(
      "THE BEER SONG\n\n" +
      i + " bottles of beer on the wall,\n" + 
      i + " bottles of beer.\n" + 
      "Take one down and pass it around.\n" + 
      (i - 1) + " bottles of beer on the wall.\n\n" + 
      "See more beer?");
    if (moreBeer == true) {
      continue;
    }
    break;
  }
}

Listing 5-10. Code to continue a for loop.

Here, users are asked if they want to continue to see the results of the countdown. If they do, the continue statement redirects control back to the start of the for loop, bypassing the break statement. If users decide not to view the continuing count, the break statement immediately ends the loop.

TOP | NEXT: Nested Loops