While programming there comes a point where you need to make decisions and carry out actions accordingly depending on different inputs. This can be achieved :
- “If” statements: where if a condition is true it is used to specify execution for a block of code.
- “Else” statements: where if the same condition is false it specifies the execution for a block of code.
- “Else if” statements: specifies a new test if the first condition is false.
- “Switch” statement: is another way to make decisions according to the conditions and carry out actions accordingly. It is generally used to replace else if statements when number of conditions are more.
- “Ternary” operator: is frequently used as a shortcut for the if else statement.
The if statement only runs if the condition enclosed in parentheses () is truthy.
if (condition) {
// block of code to be executed if the condition is true
}
EXAMPLE
if (8 > 2) {
console.log("if block");
}
// As given condition inside parentheses () is true, if block will be executed
// OUTPUT: "if block"
//Trick: if we have a boolean value then
var isTrue = true;
if (isTrue === true) {
// block of code to be executed
}
// rather then going with above method we can simply write boolean variable inside parentheses ()
if (isTrue) {
// block of code to be executed if isTrue is true
}
You can extend an if statement with an else statement, which adds another block to run when the if conditional doesn’t pass.
if (condition) {
// block of code to be executed if the condition is true
} else {
// block of code to be executed if the condition is not true
}
EXAMPLE
if (8 < 2) {
console.log("if block");
} else {
console.log("else block");
}
// As the condition inside parentheses of if is false, else block will be executed
// OUTPUT: "else block"
You can also extend an if statement with an else if statement, which adds another conditional with its own block.
if (condition1) {
// block of code to be executed if the condition1 is not true
} else if (condition2) {
// block of code to be executed if the condition2 is not true
} else {
// block of code to be executed if the none of above condition is not true
}
EXAMPLE
if (false) {
console.log("if block");
} else if (true) {
console.log("else if block");
} else {
console.log("else block");
}
// OUTPUT: "else if block"
You can use multiple if else conditionals, but note that only the first else if block runs. JavaScript skips any remaining conditionals after it runs the first one that passes.
if (false) {
console.log("if block");
} else if (true) {
console.log("else if block 1");
} else if (true) {
console.log("else if block 2");
} else {
console.log("else");
}
// if multiple conditions are true then it will just run the first block with true condition
// OUTPUT: "else if block 1"
An else if statement doesn’t need a following else statement to work. It can even work without
if (false) {
console.log("if block");
} else if (false) {
console.log("if block");
}
// OUTPUT: won't run any block due to falsy conditions
It is another way to make decisions according to the conditions and carry out actions accordingly.
switch (key) {
case value1:
// block of code to be executed if value1 matches the key
break;
case value2:
// block of code to be executed if value2 matches the key
break;
default:
// block of code to be executed if above cases fails to execute
break;
}
// you can have as many cases as you want
EXAMPLE
var key = 2
switch (key) {
case 1:
console.log(key);
break;
case 2:
console.log(key);
break;
default:
console.log("default");
break;
}
// OUTPUT: 2
Importance of break
var key = 1;
switch (key) {
case 1:
console.log("case 1 block");
case 2:
console.log("case 2 block");
default:
console.log("default");
}
// OUTPUT: case 1 block
// case 2 block
// default
It will run all the blocks below after one case value matches with the key including default until "break;" is encountered.
This operator is frequently used as a shortcut for the if else statement.
SYNTAX
condition ? exprIfTrue : exprIfFalse
EXAMPLE
- without ternary operator
var age = 18;
if(age >= 18) {
console.log("Adult");
} else {
console.log("Immature");
}
// OUTPUT: "Adult";
- with ternary operator
var age = 18;
(age >= 18) ? console.log("Adult") : console.log("Immature");
// OUTPUT: "Adult";