The do...while loop operates similarly to the while loop, except that statements within the code block execute at least once, because the browser doesn’t evaluate the conditional expression condition until the end of the code block.
There are four parts to the do...while loop:
• The do keyword
• Open and close French braces defi ne the code block
• The while keyword
• The conditional expression placed within parentheses Here’s the structure of the do...while loop:
do {
//Place statements here.
} while (conditional expression)
The following example displays numbers 1 through 10 using a do...while loop.
1. The variable i is declared and initialized.
2. The browser enters the code block of the do...while loop and executes the document.write() method that displays the number on the document.
3. The browser then evaluates the conditional expression:
• If the expression is true, the browser moves to the top of the code block and begins executing statements again.
• If the expression is false, the browser executes the statement below the do...while loop.
<!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>do...while loop</title>
</head>
<body>
<script language="Javascript" type="text/javascript">
continue
Except for the do...while loop, a loop tells the browser to execute JavaScript state-ments within the code block of the loop only if the condition is true; otherwise, the browser skips to the statement that follows the loop. The do...while loop is a little different because it tells the browser to execute statements within the block at least once before determining whether the condition is true.
On some occasions, you’ll want the browser to stop executing statements within the loop and return to the top of the loop to reevaluate the conditional expression.
You can tell the browser to return to the top of the loop at any time while the brows-er executes statements within the loop by using the continue keyword.
The continue keyword instructs the browser to stop executing statements with-in the loop immediately and to go to the top of the loop, just as if the browser reached the end of the loop. If a for loop is being used, the browser executes the post loop statements, which typically increments or decrements the initializer variable and then evaluates the test condition. If a while loop is used, the browser evaluates the test condition. If the conditional expression is true, the browser reenters the code block of the loop and executes statements beginning with the fi rst statement.
Let’s say that you want to display numbers 1, 2, 3, and 5 on the screen. You don’t want to display the number 4. Here’s how this is done using a while loop and the continue keyword:
<!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>continue</title>
</head>
<body>
<script language="Javascript" type="text/javascript">
As long as the value of variable i is less than 5, the browser executes statements within the code block. Since variable i is initialized with 0, the browser enters the loop and increments the value of i, making it 1. The browser then evaluates the
ch03.indd Sec1:71
ch03.indd Sec1:71 5/2/2005 3:50:13 PM5/2/2005 3:50:13 PM
conditional expression to determine whether the value of variable i is 4. If so, the browser executes the continue statement within the code block of the if state-ment. The continue statement tells the browser to return to the top of the loop immediately and reevaluate the conditional expression.
The browser executes the fi rst statement within the code block of the while loop, which increments the value of variable i from 4 to 5. Once again, the browser evaluates the conditional expression in the if statement. This time, variable i equals 5, not 4, so the browser proceeds to the write() statement again to write the value of variable i, which is 5, to the screen.
Looking Ahead
You learned two important JavaScript programming techniques in this chapter: how to have a browser make a decision by using the if statement and the switch...case statement and how to have the browser repeatedly execute JavaScript statements without your having to duplicate code.
The if statement contains a conditional expression and a code block. If the con-ditional expression is true, then the browser executes statements within the code block. You provide the browser with alternative statements by using else with the if statement. If the conditional statement is false, then the browser executes state-ments within the else code block.
Sometimes you’ll want the browser to test another condition if the conditional expression in the if statement is false. You tell the browser to do this by using the if...else if statement. The else if portion of this statement contains another condi-tional expression and statements within a code block that are executed if the second conditional expression is true. Yet still another version of the if statement is the if...
else if...else statement, which is similar to the if...else statement, where statements within the else code block are executed if neither the fi rst nor second conditional expression is true.
You also learned how to use the switch...case statement to have the browser make a decision within your JavaScript. The switch portion of the statement con-tains a value that is compared to values of the case portion of the statement. If there is a match, then statements within the case are executed. If there isn’t a match, those statements are skipped.
The last statement within the case portion of the switch...case statement is typically the break statement. The break statement tells the browser to break out of the switch...
case statement without evaluating subsequent case values. The break statement can also be used to tell the browser to break out of any loop without fi nishing the loop.
ch03.indd 72
ch03.indd 72 5/2/2005 3:50:13 PM5/2/2005 3:50:13 PM
If the switch value doesn’t match any case values, the browser executes state-ments beneath the default portion of the switch...case statement. The default portion is optional.
A browser can repeat statements by placing statements within four kinds of loops:
for loop, for in loop, while loop, and the do...while loop. Each loop has a conditional expression that must be met in order for the browser to enter and execute statements within the code block of the loop. There is one exception: statements within a do...while loop execute at least once regardless of whether the test condition is true or false.
Now that you know how to have a browser make decisions and execute state-ments repeatedly, it is time to move on and learn how to store and manipulate lists of information, such as a list of products. You do this by using an array, which you’ll learn about in the next chapter.
Quiz
1. What loop executes statements regardless of whether a condition is true or false?
a. do...while loop b. while loop c. for loop d. for in loop
2. True or False. A switch...case statement cannot have a default case.
a. True b. False
3. What loop requires the browser to execute statements within the loop at least once?
a. do...while loop b. while loop c. for loop d. for in loop
4. The loop counter in the for loop is used to a. Increase the expression by 1
b. Increase or decrease the loop counter value by 1
ch03.indd 73
ch03.indd 73 5/2/2005 3:50:13 PM5/2/2005 3:50:13 PM
c. Limit the number of statements within the code block d. Limit the output of statements within the code block 5. True or False. A for loop can become an endless loop.
a. True b. False
6. What loop is used to step through an unknown number of items on a list?
a. do...while loop b. while loop c. for loop d. for in loop
7. True or False. The default clause is used in an if statement to set default values.
a. True b. False
8. What is the purpose of else in an if...else statement?
a. Contains statements that are executed if the conditional expression is true
b. Defi nes another conditional expression the browser evaluates if the fi rst conditional expression is false
c. Contains statements that are executed if the conditional expression is false
d. Used to nest an if statement
9. True or False. You must include an initializer as part of a for loop.
a. True b. False
10. True or False. The browser can be required to evaluate every case in a switch...case statement event if the criterion matches a case value.
a. True b. False
ch03.indd 74
ch03.indd 74 5/2/2005 3:50:13 PM5/2/2005 3:50:13 PM
75
CHAPTER
Arrays
Nearly every JavaScript that you write temporarily stores information into computer memory until the JavaScript processes the information. Information is stored into mem-ory by assigning the information to a variable. You learned about variables in Chapter 2.
Suppose you had to store 100 pieces of information in memory, such as the name of 100 products in a sales catalog. You could declare 100 variables to store product names; this might seem a good idea until you realized that you’d have to devise 100 unique variable names and then name all the variables every time your JavaScript needed to process the list of product names.
Professional JavaScript developers use an array instead of a long list of vari-ables. An array has one name and can hold as many values as is required by your JavaScript application. In this chapter, you’ll learn about arrays and how to use them in your JavaScript to store and manipulate large amounts of data.