If Condition

JavaScript also have the conditional statements, that help us to check the equality of the variables and perform some task if the condition is correct or not. It help us to handle the flow of the program.

JavaScript have the following if conditional statements:

1. if condition
2. if-else condition
3. if-else if-else condition

if Condition

If condition are used to check the condition and execute some code base on it.

Syntax:

if(condition){
        // Code to execute if the condition is true
}

Example:

var a = 100;
var b = 200;

if (a > b) {
    alert("a is greater the b");
}

if (a < b) {
    alert("a is less than b");
}

In above example I declared the two variables called “a” and “b” and I assign the value 100 and 200 respectively to the “a” and “b” variables. After that I used the if condition to check the which variable’s value is greater or less than each other.

First If condition is wrong so the first alert message can not be displayed. But the Second condition is true because the value of a is less than b. So the second alert message will be displayed with the message “a is less than b”.

We are free to not use the curly braces {}, If there is only one line to execute if the condition is true, If we have to execute the multiple line than we have to use the curly braces {}.

Example:

if (1 == 1)
    alert("Condition is true, This is the single line to execute");

if (1 == 1) {
    alert("This condition is the also true");
    alert("This is second line to execute");
}

Execution flow of the If condition

• if condition will be check first
• If, if condition is true than than the block of the if condition will be executed, other wise no code will be executed.

if-else condition

if-else condition is useful to when we have to execute some task if the condition is true and we can also execute some another part if the condition is the false.

It is help to handle the our program in some epic way.

Syntax:

if (condition) {
    // If the condition is true than
    // this part will be executed
} else {
    // If the condition is false than
    // this part will be executed
}

Example:

var a = 100;
var b = 200;

if (a > b) {
    alert("a is greater than b");
} else {
    alert("a is less than b");
}

//a is less than b

var a = 200;
var b = 100;

if (a > b) {
    alert("a is greater than b");
} else {
    alert("a is less than b");
}

//a is greater than b

Execution flow of the if-else condition

• if condition will be check first
• If, if condition is true than the block of the if condition will be executed, Otherwise the block of the else condition will be checked

if-else if-else condition

JavaScript provides the else if for the multilevel condition checking, Yes we can check the condition at multiple level, It allow us to check the second condition if the first condition is false or check the third condition if the second is false and so on. And at the end if all the condition is false than else block is execute if we wrote it.

if (condition) {
    // If the condition is true
    // than this part will be executed
    // and another else if condition is not check
} else if (condition) {
    // If the condition is true
    // than this part will be executed
    // and another else if condition is not check
} else if (condition) {
    // If the condition is true
    // than this part will be executed
    // and another else if condition is not check
} else {
    // If no condition is true than
    // this part will be executed
}

Example 1:

var condition = false;

if (condition == true) {
    alert("Welcome to true part!!!");
} else if (condition == false) {
    alert("Welcome to false part!!!");
}

//Welcome to false part!!!

In above example I used the only one “else if” to check the second condition on the variable. If one of the condition is true than it execute the that part, If all condition is false than none of the part will be executed.

Example 2:

var a = 3;

if (a == 1) {
    alert("The value of the a is 1");
} else if (a == 2) {
    alert("The value of the a is 2");
} else if (a == 3) {
    alert("The value of the a is 3");
}

//The value of the a is 3

In above example I used the two “else if” to check the three level condition. If one of the condition is true than it execute the that part, Otherwise no part will be executed. Here the second “else if” condition will be true and executed the part of the second “else if”.

Example 3:

var a = 3;

if (a == 1) {
    alert("The value of the a is 1");
} else if (a == 2) {
    alert("The value of the a is 2");
} else {
    alert("The value of the a is not 1 or 2");
}

//The value of the a is not 1 or 2

In above example, I used the one “else if” to check the two level condition. If one of the condition is true than it execute the that part, otherwise else part will be execute, Yes it right If none of condition is true than the else part will be execute.

Execution flow of the if-else if-else condition

• if condition will be check first
• If, if condition is true than the block of the if condition will be executed and the remaining condition will be not checked.
• If, the if condition is false than first “else if” condition is check, and if the “else if” is true than the block of it’s code will be executed the remaining condition will be not checked.
• If the first “else if” condition was false than the second “else if” condition will be check, and this process will be continue till the all the condition is checked or one of the condition is become true.
• If all the “else if” condition is false than at the end “else” block of the code is executed, if we wrote the else block otherwise no code will be executed.