Skip to content

Instantly share code, notes, and snippets.

@Lakshay-Batra
Last active July 6, 2020 12:16
Show Gist options
  • Save Lakshay-Batra/c3dcffa81e4892337805478a62d244a5 to your computer and use it in GitHub Desktop.
Save Lakshay-Batra/c3dcffa81e4892337805478a62d244a5 to your computer and use it in GitHub Desktop.

Conditionals

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.

If 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
}

If Else Statement

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"

Else If Statement

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

Switch statement

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.

Ternary operator(?)

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";
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment