Conditional statements if, else, switch

Javascript Course

• The if() else statement
• The else if() instruction
• switch() statement

The most interesting, but difficult, in writing a script is designing it so that it can take decision while is executed.
Using conditional instructions can make programs to test various conditions and then decide how to manipulate the datas.

JavaScript uses the following conditional instructions:

• if() - use if statement to execute some code only if a specified condition is True.
• if() else - it executes some code if a condition is True and another code if the condition is False.
• if() else if() - it executes some code if a condition is True, or other code if that condition is False and other condition is True.
• switch() - selects which piece of code to be executed.

The if() statement

The general form of this instruction is the following:

if (condition){
 //Code to be executed if condition is true
}

- 'condition' can be any logical expresion.
- If 'condition' returns TRUE, executes the code within curly braces, otherwise, when the condition returns false, it passes over the cod.

Here's an example. The following script prints 'Hello' if the hour is greater than 11.

The if() else statement

In the previous example we saw that it displays 'Hello!' if 'hour>11' and if not, nothing happens.
Using the instruction if() else we can set commands to be executed when the condition of the if() is FALSE.
- Syntax:

if(condition){
 // code to be executed if condition is True
}
else {
 // code rto be executed if condition is False
}

- 'condition' can be any logical expresion.
If 'condition' return TRUE it is executed the code inside the first braces (that belongs to if()), otherwise, when the condition returns false it is executed the code of the second group of braces (after else).

Here's an example. The following script prints "Good morning" if the hour is greater than 11, otherwise display "It's ... o`clock'.

We use the Date object to get current hour, will be explained in another lesson.

The else if() instruction

The else if() instruction is added after if(), and before 'else'.
This instruction is used to check if another condition is True after 'if()', to execute another code when 'if()' is FALSE, but the condition from else if() is TRUE.

- Syntax:

if(condition_1){
 //code to be executed if this condition is True
}
else if(condition_2){
 //code to be executed if condition_1 is False and condition_2 is True
}
else {
 //codul care va fi executat cand ambele: conditie_1 si conditie_2 sunt FALSE
}

- 'condition_1' and 'conditie_2' can be any logical expresion.
First it is checked 'condition_1', if the result is TRUE it will be executed the code from if(). But if it is FALSE, it will be checked the condition from else if() (conditie_2). If 'condition_2', is True, it will be executed the code from else if(), but if 'condition_2' is FALSE, it will be executed the code from 'else'.

- Example, the following code writes "Good morning" if the hour is greater than 5 and less than 11, otherwise, if the hour is between 11 and 19 displays 'Good day', otherwise, it shows: 'It's ... o`clock'.

After the if() instruction you can add several sets of else if(); and 'else' is optional.

switch() statement

The switch() instruction is used to compare a value with others from a list.

Syntax:

switch(expresion){
case value1:

 code executed if expresion = value1
 break
case value2:
 code executed if expresion = value2
 break
case value3:
 code executed if expresion = value3
 break
default:
 code executed if expresion is other then value1, valoare2 or valoare3
}

- First we have a single expression between parentheses (most often a variable), that is evaluated once. The value of the expression is then compared with the values for each case in the structure. If there is a match, the block of code associated with that case is executed. Use break to prevent the code from running into the next case automatically.

Here is a sample script that displays a message depending on weekdays: - The variable 'day' takes the number of the week-day from the variable 'd' (Sunday = 0, Monday = 1, ...).
- The switch() statement compares the value of 'day' with the value of each case. If there is a match, the block of code associated with that 'case' is executed.
- If none of the values of 'case' match the variable 'day', will execute the code associated with 'default'.

Here is another example where the 'case', uses string values (it will display the text: Brother).

<img src="image.jpg" usemap="#map1">
<map name="map1">
  <area shape="rect" coords="9, 120, 56, 149" href="#">
  <area shape="rect" coords="100, 200, 156, 249" href="#">
</map>

#id {
  overflow: auto;
}

document.getElementById("id").onmouseover = function(){
  document.write("Have Good Life");
}

if(isset($_GET["id"])) {
  echo $_GET["id"];
}