Chapter 4: Decision Making with
Control Structures and Statements
JavaScript - Introductory
Previewing CartoonQuiz.html File
Section A:
Decision Making
Objectives
In this section, students will learn about:
• if statements
• if …else statements
• Nested if statements
• Switch statements
If Statements
• The process of determining the order in which
statements execute in a program is called
decision making or flow control
• The if statement is used to execute specific
programming code if the evaluation of a
conditional expression returns a value of true
• Syntax for the if statement is:
if (conditional expression) {
statement(s);
}
If Statements
• The if statement contains three parts: key word
if, a conditional expression enclosed within
parentheses, and executable statements
• The statement immediately following the if
statement in Figure 4-2 can be written on the
same line as the if statement itself
If Statements
• Command block refers to multiple statements
contained within a set of braces
• When an if statement contains a command
block, the statements in the block execute
when the if statement’s condition evaluates to
true
• Now, if the condition evaluates to false, both
statements will be bypassed, since they are
contained within a command block
If Statements
Comparison and Logical Operators
with the If Statement
Output of CartoonQuiz1.html
If … Else Statements
• When using an if statement, include an else
clause to run an alternate set of code if the
conditional expression evaluated by the if
statement returns a value of false
• An if statement that includes an else clause is
called an if … else statement
• Consider the else clause a backup plan
• An if statement can be constructed without the
else clause. However, the else clause can only be
used with an if statement
Nested If and If…Else Statements
• An if statement contained within an if or if… else
statement is called a nested if statement
• Similarly, an if…else statement contained within
an if or if… else statement is called a nested if …
else statement
• Use nested if and if…else statements to perform
conditional evaluations in addition to the original
conditional evaluation (for example:
var numbr = 7;
if (number >5)
if (number < 10)
documnt.writeIn (
“The number is between t and 10.”);
Greeting Program with
Nested If Statements
Modified Greeting Program
with Nested If Statements
Switch Statements
• A switch statement controls program flow by
executing a specific set of statements, depending
on value of an expression
• The switch statement compares the value of an
expression to a label contained within a switch
statement
• If the value matches a particular label, then the
statements associated with the label execute
• The labels within a switch statement are called
case labels and mark specific code segments
Examples of Case Labels
Switch Statements
• A Case label consists of keyword case, followed
by a literal value or variable name, followed by a
colon
• A case label can be followed by a single
statement or multiple statements
• Default label contains statements that execute
when the value returned by a switch statement’s
conditional expression does not match a case
label; keyword is default followed by a colon
• Break statement is used to exit switch statements
and other program control statements
Function Containing
a Switch Statement
Greeting Program Using
a Switch Statement
Section A: Chapter Summary
• Flow control is the process of determining the
order in which statements are executed in a
program
• The if statement is used to execute specific
programming code if the evaluation of a
conditional expression returns true
• A command block refers to multiple statements
contained within a set of braces
• After an if statement’s condition evaluates true,
either first statement following condition or
command block following condition executes
Section A: Chapter Summary
• Statements following an if statement’s command
or command block execute regardless of whether
if statement’s conditional expression evaluates
true or false
• The else clause runs an alternate set of code if
the conditional expression evaluated by an if
statement returns a value of false
• In an if…else construct, only one set of
statements executes: either statement following if
statement or statements following the else clause
Section A: Chapter Summary
• An if statement contained within another if
statement is called a nested if statement
• The switch statement controls program flow
by executing a specific set of statements;
depending on the value returned by an
expression
• Case labels within a switch statement mark
specific code segments
Section A: Chapter Summary
• A Default label contains statements that execute
when the value returned by switch statement’s
conditional expression does not match a case
label
• When a switch statement executes, the value
returned by the conditional expression is
compared to each case label in the order in
which it is encountered
• A break statement is used to exit a switch
statement
Section B:
Repetition
Objectives
In this section, students will learn about:
• while Statements
• do … while Statements
• for Statements
• for … in Statements
• with Statements
• continue Statements
While Statements
• Loop statement repeatedly executes a statement
or a series of statements while a specific
condition is true or until a specific condition
becomes true
• The simplest type of loop statement is the while
statement used for repeating a statement or
series of statements as long as a given
conditional expression evaluates true
• Each repetition of a looping statement is called
an iteration
While Statements
• A Counter is a variable that increments or
decrements with each iteration of a loop
statement
• Often name counter variables count, counter,
or something similar
• The following code is an example of a while
statement:
var count = 1;
while (count <= 5) {
document.writeIn(count);
++count;
}
Output of a While Statement
Using an Increment Operator
Output of a While Statement
Using a Decrement Operator
While Statements
• while loop using decrementing counter variables
var count = 10;
while (count > 0) {
document.writeIn (count);
--count;
}
• Infinite loop is a situation in which a loop
statement never ends because its conditional
expression is never updated or false
var count = 1;
while (count <= 10) {
alert (“The number is “ + count);
}
While Statements
• The user must
force a web
browser that is
caught in an
infinite loop to
close by pressing
Ctrl+Alt+Delete to
access Task List
or Manager
Output of SpeedLimit.html
Do… While Statements
• Do … while statement executes a statement or
statements once, then repeats execution as long
as given conditional expression evaluates to true
• The syntax for do…while statement is as follows:
do {
statement(s);
} while (conditional expression);
• As with the while statement, include code that
changes some part of conditional expression in
order to prevent an infinite loop from occurring
Examples of a Do … While Statement
Days of Week Program
in a Web Browser
For Statements
• Use the for statement to loop through code
• A for statement is used for repeating a
statement or series of statements as long as
a given conditional expression evaluates true
• The for statement performs essentially the
same function as the while statement: if a
conditional expression in for statement
evaluates true, the for statement executes
repeatedly until it evaluates false
For Statements
• When the JavaScript interpreter encounters a for
loop, the following steps occur:
– The initialization expression is started
– The for loop’s condition is evaluated
– If the condition evaluation in Step 2 returns a value of
true, then the for loop’s statements execute, Step 4
occurs
– The update statement in the for statement’s constructor
is executed
• You can omit any of the three parts of for
statement constructor, but must include
semicolons to separate each section
A For Statement that Displays
the Contents of an Array
Output of Fast Foods Program
Examples of a For Statement
Output of CartoonQuizFinal.html
For …In Statements
• for … in statement is a looping statement that
executes the same statement or command block
for all the properties within an object
• The syntax for the for… in statement is:
for (variable in object) {
statement (s);
}
• Unlike other loop statements, the for…in does not
require a counter or any other type of code to
control how the loop functions
A For … In Statement Printing the
Names of Properties Within an Object
For …In Statements
• There is no set order or way to control how the
properties in an object are assigned to a for…in
statement’s variable
• One benefit of for…in statement is that it
enumerates, or assigns an index to, each
property in an object
Output of SportsCar.html
With Statements
• The with statement eliminates need to retype the
name of an object when properties of same object
are being referenced in a series
• The syntax for the with statement is as follows:
with (object) {
statement(s);
}
• The name of object you want to reference is
placed within parentheses following the with
keyword
Example of a With Statement
Assigning Values to Object Properties
Continue Statements
• A Continue statement halts looping statement
and restarts the loop with a new iteration
• Use the continue statement when you want to
stop loop for current iteration, but want loop to
continue with a new iteration
A For Loop with a Continue Statement
Output of SportsCar3.html
Section B: Chapter Summary
• A loop statement repeatedly executes statement
as long as a specific condition is true or until a
specific condition becomes true
• The while statement is used for repeating a
statement or series of statements as long as
given conditional expression evaluates true
• Each repetition of a looping statement is called
an iteration
• A counter is a variable that increments with each
iteration of a loop statement
Section B: Chapter Summary
• You must include code that tracks the progress of
the while statement and changes the value
produced by conditional expression once desired
tasks done
• If a counter variable is beyond range of a while
statement’s conditional expression, the while
statement is bypassed completely
• In an infinite loop, a loop statement never ends
because its conditional expression is never
updated
Section B: Chapter Summary
• The do…while statement executes a statement or
statements once, then repeats execution as long
as given conditional expression is true The for
statement is used for repeating a statement or
series as long as a given conditional expression
is true
• You can omit any of the three parts of the for
statement constructor, but you must include the
semicolon that separates each section
• The variable name in the for…in statement
constructor holds an individual object property
Section B: Chapter Summary
• The for…in statement executes the same
statement or command block for all the
properties within an object
• The for…in statement enumerates, or assigns an
index to, each property in an object
• The with statement eliminates the need to retype
the name of an object when properties of same
object are being referenced in a series
• The continue statement halts a looping statement
and restarts the loop with a new iteration