JavaScript Control Statements
- Introduction to JavaScript Control Statements
- JavaScript Selection Statements
- JavaScript Iteration Statements
Introduction to JavaScript control statements
Control statements control the flow of the
program. As you can choose from control statements which statement you want to
execute, and which you don’t want. Logic is performed with the help of control
statements.
For example, if you want to print just even numbers
from 1 to 100. In this situation, you can use the control statements to find
out whether the number is completely divided by 2 or not. If the number is divided by 2, then it is even otherwise(else) odd and it is printed.
if (num% 2 == 0)
{
document.write
(num, "is even");
}
else
{
document.write (num, "is odd");
}
else
{
document.write (num, "is odd");
}
No logic can be performed in the program without
control statements. In other words, you can choose which statements will be
executed, in which situation. At the same time, you can execute a statement
several times with the help of control statements.
Types of Control Statements
Control statements have been divided
into 3 categories. These categories also define the tasks of control
statements. These categories are being given below.
1. Conditional statements - In this category's control statements are used to select and execute according to the situation. The control statements of this category are given below.
1. Conditional statements - In this category's control statements are used to select and execute according to the situation. The control statements of this category are given below.
- If
- If-Else
- Nested-If
- Switch case
2. Looping statements - These statements
are used to execute particular statements in the program repeatedly. The
control statements of this category are given below.
- For
- Do-While
- While
3. Jump statements - These types of
statements are used to jump from one place to another in the program. The
statements in this category are given below.
- Break
- Go to
- Selection Statements
As I have told you before, some particular
statements execute through selection statement logic. Let us now try to
understand the selection statements by example.
if Statement
If statement tests a condition, if the
condition is true then the statements given in the brackets are executed and if
the condition is false then this block is skipped.
Example 1
if (5> 3)
{
document.write
("This will be displayed");
}
As you can see in the above example, where the given
condition is true, so the statement inside the brackets will be executed. Let's
look at another example.
Example 2
if (3> 5)
{
document.write
("This will not be displayed");
}
In this example the condition is
false, so the statement given in the brackets will not be executed.
if else
If else statement is the same as if statement.
Just add another else part. In Else part, you write the statements which
execute when the condition is false. Let us look at the example.
if (15>20)
{
document.write ("This
will not be displayed");
}
else
{
document.write ("This
will be displayed");
}
elseif
If you want a condition to be false then do not
execute the second part and check other condition, you can use else if
statements for this.
With else if statements you can check more than
one condition and if all the condition is false then you can execute the else
part.
For this, you use elseif keyword. The first
condition is executed like a normal if else statement. Apart from this, whatever
conditions you want to add are defined by the elseif keyword between if and the
else part.
Its simple syntax is being given below.
if (condition 1)
{
// Will be executed if above
condition is true
}
elseif (condition 2)
{
// Will be executed if
the 1st condition is false and this condition is true.
}
....
....
....
else if (condition n)
{
// Will be executed if all
conditions were false and this condition is true.
}
else
{
// Will be executed if
all the conditions are false
}
Let's now try to understand it with an example.
if (7>9)
{
document.write
("This will not be executed!");
}
elseif (6>7)
{
document.write
("This will not be executed!");
}
else
{
document.write
("This will be executed!");
}
Nested If
If you want you can also insert an if condition
in other if condition. Its structure is being given below.
if (condition)
{
if
(condition)
{
//
Statement to be executed
}
}
else
{
// Statements to
be executed
}
As you can see in the above syntax one if the condition is defined within another if condition. If you want to add else part
in nested you can also add. Let's now try to understand it with an example.
if (7>5)
{
if (7>8)
{
document.write
("This will not be executed");
}
else
{
document.write
("7 is greater than 5 but not 8");
}
}
else
{
document.write
("7 is not greater than 5");
}
}
Switch case
The switch case is exactly as if statement. But
in this, you can check many conditions at once. Cases are defined in the switch
case. Later these cases are executed by a choice variable. The case where
the Choice variable matches, the same case is executed.
An example of this is being given below.
var ch = 2;
// Passing selection to execute desired case
switch (ch)
{
case 1:
document.write
("ONE");
break;
case 2: document.write
("TWO");
break;
case 3: document.write
("THREE");
break;
default: document.write
("Enter appropriate value");
break;
}
As you can see, after every case the break
statement has been used. If you do not use break statements then all the cases
are one by one execute. In this example, variable 2 has value 2 so the second
case will execute and TWO will be displayed.
Looping Statements
While Loop
In this loop, you give a condition as long as
the condition is true, the statements given in the block are executed. Once the
condition is false, the loop gets terminated and the execution of the program
continues.
var num = 0;
// while loop iterating till num is less than 7
while (num <7)
{
document.write
("Hello");
num ++;
}
In this example, until the num is less than 7,
the block of the loop will be executed. One thing to notice here is that the
num is incremented every time so that after a few steps the loop is terminated.
If this is not done on this, the loop will never terminate. It will continue at
the infinite time.
Therefore, to avoid this situation, the loop the control variable is incremented in any type of loop.
Do-While Loop
Do while loop is similar as while loop. It just
executes without first checking the condition and after that, it checks the
condition every time. If the condition is true then the block of do statements are executed.
Let's understand this with an example.
var num = 0;
// Do-while loop
do
{
document.write
("hello");
num ++;
}
while (num<7);
As you can see, first do block execute and then the condition will be checked. The characteristic of this loop is that if the condition
is true or false, then the loop will definitely execute once. If the condition is
true then the loop is further executed or else it gets terminated.
For Loop
In all loops, for loop is the easiest and most
commonly used. In it, you define the entire loop in a single line. If the
condition is true then the given statements in the block are executed. An
example of this loop is given below.
// For loop running till i is less than 10
for (var i = 0; i <10; i
++)
{
document.write
("This will be printed while the condition is true");
}
In the for loop both condition and increment are
defined simultaneously. In addition, the loop control variable is also defined
in it. As soon as the condition is false, the loop gets terminated.
Jump Statements
The execution of Jump statements program is used
to transfer from one place to another. These statements are used in special
cases. These are being given below.
Continue
You can skip any iteration of any loop through
the continue statement. As you want, the 3rd iteration will skip and the
compiler will not take any action. You can do this like the example given
below.
for (var i = 0; i <10; i ++)
{
if (i == 2)
{
//
Skipping the third iteration of the loop
continue;
}
document.write ("This
will be displayed in iterations except for 3rd");
}
Using the continue statement, the compiler
will skip 3rd iteration and no statement will be executed. After this, the next
iteration will begin.
Break
The break statement is used to stop the execution.
When the break statement comes, the compiler brings the execution out of that
block. It can be easily understood by the example of a loop.
for (var i = 0; i <10; i ++)
{
if (i == 2)
{
//
Breaking 3rd iteration of the loop
break;
}
document.write
("This will be displayed 2 times only");
}
In the above example, as soon as the 3rd
iteration of the loop arrives, the loop is terminated by the break statement
and the execution of the program starts from outside the loop.
Hello, I think your blog might be having browser compatibility
ReplyDeleteissues. When I look at your website in Opera, it looks
fine but when opening in Internet Explorer, it has some overlapping.
I just wanted to give you a quick heads up! Other then that, very good blog!