A script will contain many lines of code. Each line of code is executed one by one from the top to the bottom. Sometimes it so happens that we would like a line of code to be executed only under certain conditions. In such cases, we should use conditional constructs. These constructs are basically statements that contain a condition. A condition would be a statement that when executed would yield a true or false as the result.

A conditional statement can contain relational and logical operators. There are different kinds of conditional constructs that have ideal situations in which they are best suited.

The simple ’if’ construct

If(condition)
{
    // Set of statements to be executed if the condition
    //evaluates to true, and skipped if it evaluates to false
}

Notice how the syntax of the construct is simple. The ‘if’ keyword specifies that it is the beginning of an ‘if’ construct. Following the keyword is the conditional statement. A set of one or more statements follow the condition within braces. If the condition evaluates to true, then the statements within the braces are executed. If the condition evaluates to false, then the statements are skipped altogether. 

if(1<2)
{
  alert("1 is not greater than 2");
}

This is a simple branch. There are two paths. One, if the condition evaluates to true and two, the condition evaluates to false. What if we want two alternatives? Here is the solution.

If…else construct

 

if(condition)
{
  //Statements to be executed if the condition //evaluates to true.
}
else
{
  //Statements to be executed if the condition //evaluates to false.
}

The if..else construct can help you take two branches of execution. We can have an alternative set of statements to be executed. The statements following if will be executed if the condition evaluates to true. The statements following else will be executed if the condition evaluates to false.

if(1<2)
{ 
  alert("true");
}
else
{
  alert("false");
}

Now, in the example above it is evident that 1 is in fact less than 2. Hence the alert statement present after the ‘ if’ is executed. Let us change the condition a bit and retain the other parts of the code as such.

if(1>2)
{ 
  alert("true");
}
else
{
  alert("false");
}

Can you see from the condition that it would evaluate to false? Hence the statements after else are executed. What if we want more and more alternatives? We have if..else if..else construct to sort that out.

If..else if…else construct

There can be multiple conditions. The construct is otherwise called a ladder.  Here the if is followed by a condition and a set of statements. After this an else if is followed by another condition and a set of statements. After the required number of else if statements, comes the else and the set of statements.

If(condition)
{
  //statements to be executed if condition evaluates to true.
}
else if(condition)
{
  //statements to be executed if previous conditions are executed to false //and this condition evaluates to true.
}
:
:
:
else
{
  //statements to be executed if all the previous conditions fail.
} 

The ladder is to offer checking of multiple conditions. The first condition that comes with if is executed. If it evaluates to true, then the statements following if are executed. If it evaluates to false, then the next condition is executed and so on. If none of the conditions evaluate to true, then the statements following else are executed. The else is not mandatory.

In the code snippet example below, if x has a value greater than zero, one would be displayed an alert message, positive. If not, x is checked for equality to zero. If x is zero then an alert message zero is displayed. If x is not zero then an alert negative is displayed.

var x;
if(x>0)
{
  alert("Positive");
}
else if (x==0)
{
  alert("zero");
}
else
{
  alert("negative");
}

Switch…case..default

This is one of the conditional constructs that can take an expression and compare it for equality with different values and execute the statements against each case. It is a modification of the if..else if.. ladder. Here one can check only for equality with different values.

Switch(expression)
{
case value1:
//statements
break;
:
:
Case value n:
//statements
break;
default:
//statements
}

These kinds of ladders are ideal in giving menu like options. Depending on the values of x and y assigned to the variables, one can see that if the value sums up to 4, then the first case value matches with the evaluated expression. If not, it is matched with 6. If not the statement in the default is executed. The default case is not mandatory. The break statement makes the control move to the statement after the switch ladder failing which the statements following the matching case are also executed.

var x,y;
//Assign some value to x and y
switch(x + y)
{
case 4:
alert("x and y sum to 4");
break;
case 6:
alert("x and y sum to 8");
 break;
default:
alert("No match");
}

One can use the same set of statements for multiple cases by specifying the case values and giving the statements after the last case value.

var x;
//Assign some value to x
switch(x)
{
Case0:
Case 1:
alert("Match found");
}