DCIT 65 – Web Development Lecture # 5
Control Structures
In the vernacular of programming, the kinds of statements that make decision and loop around
to repeat themselves are called control structures. An important part of the control
structure is the condition.
if constructions
The simplest program decision is to follow a special branch or path of the program if a certain
condition is true.
Syntax:
if (condition) {
statement[s] if true
}
Ex:
if (myAge < 18) {
alert(“Sorry, you cannot vote.”);
}
if else constructions
Not all program decision are as simple as the one shown for the if construction. Rather than
specifying one detour for a given condition, you might want the program to follow either
of two branches depending on that condition. It is a fine but important distinction. In the
plain if construction, no special processing is performed when the condition evaluates to
false. But if processing must follow one of two special paths, you need the if… else
construction.
Syntax:
if (condition) {
statement[s] if true
} else {
statement[s] if false
}
Ex:
var febDays;
var theyear = 2008;
if (theyear % 4 == 0) {
febDays = 29;
} else {
febDays = 28;
1 Prepared by: Ms. Steffanie D. Maglasang
DCIT 65 – Web Development Lecture # 5
}
JavaScript Assignment Operators
Loop - are used to execute the same block of code a specified number of times or while a
specified condition is true.
Assignment operators are used to assign values to JavaScript variables.
Given that x=10 and y=5, the table below explains the assignment operators:
Operator Example Same As Result
= x=y x=5
+= x+=y x=x+y x=15
-= x-=y x=x-y x=5
*= x*=y x=x*y X=50
/= x/=y x=x/y x=2
%= x%=y x=x%y x=0
JAVASCRIPT LOOPS
In JavaScript there are two different kinds of loops:
for - loops through a block of code a specified number of times
while - loops through a block of code while a specified condition is true
The for Loop
The for loop is used when you know in advance how many times the script should run.
Syntax
for (var=startvalue;var<=endvalue;var=var+increment)
{
code to be executed
}
Example
<html>
<body>
<script type="text/javascript">
var i=0;
for (i=0;i<=10;i++)
{
document.write(i + “ ”);
}
</script>
</body>
</html>
2 Prepared by: Ms. Steffanie D. Maglasang
DCIT 65 – Web Development Lecture # 5
Result
0 1 2 3 4 5 6 7 8 9 10
The while loop
The while loop is used when you want the loop to execute and continue executing while the
specified condition is true.
While (var<=endvalue)
{
code to be executed
}
Note: The <= could be any comparing statement.
Ex:
var xsum = 0;
var x;
for(x=1;x<=10;x++)
{
xsum + = x;
}
document.write(x);
document.write(xsum);
loop x xsum = xsum + x
1st loop 1 0=0+1
2nd loop 1 1=1+1
3rd loop 2 2=2+1
4th loop 3 3=3+1
5th loop 4 4=4+1
6th loop 5 5=5+1
7th loop 6 6=6+1
8th loop 7 7=7+1
9th loop 8 8=8+1
10th loop 9 9=9+1
11th loop 10 10 = 10 + 1
Example
3 Prepared by: Ms. Steffanie D. Maglasang
DCIT 65 – Web Development Lecture # 5
Explanation: The example below defines a loop that starts with i=0. The loop will continue to
run as long as i is less than 10. i will increase by 1 each time the loop runs.
<html>
<body>
<script type="text/javascript">
var i=0;
while (i<10)
{
document.write(i + “ “);
i=i+1;
}
</script>
</body>
</html>
Result
0123456789
The while Statement
The while statement is used to execute a block of code while a certain condition is true. The
format of the while statement is as follows:
while ( condstmt ) {
zero of more statements
}
A while Loop That Adds a Sequence of Numbers]
var x = 1;
var xsum = 0;
while ( x <= 10 ) { // loop until x is greater than 10
xsum += x; // add x to the running sum xsum
x++; // increment x
}
The for Statement
The for statement is the most powerful and complex of the three flow control constructions in
JavaScript. The primary purpose of the for statement is to iterate over a block of statements
for some particular range of values. The for statement has the following format:
for ( initstmt; condstmt; updstmt ) {
forblock
}
Adding Up a Sequence of Numbers Using for
var xsum = 0;
var x;
for ( x = 1; x <= 10; x++ ) { // 1: loop while x is <= 10
xsum += x; // 2: add x to xsum
4 Prepared by: Ms. Steffanie D. Maglasang
DCIT 65 – Web Development Lecture # 5
5 Prepared by: Ms. Steffanie D. Maglasang
