ES6 Decision-Making

ES6 conditional statements are used to perform different actions based on various conditions. The conditional statement evaluates a condition before the execution of instructions.

When you write the code, you require to perform different actions for different decisions. You can easily perform it by using conditional statements.

ES6 Decision-Making

Types of Conditional Statements

The conditional statements in JavaScript are listed below:

  • if statement
  • if….else statement
  • if….else if….statement
  • nested if statement
  • switch statement

Let us try to elaborate on these conditional statements.

The if statement

It is one of the simplest decision-making statement which is used to decide whether a block of JavaScript code will execute if a certain condition is true.

Syntax

snippet
if (condition) {
  // block of code will execute if the condition is true
}

If the condition evaluates to true, the code within if statement will execute, but if the condition evaluates to false, then the code after the end of if statement (after the closing of curly braces) will execute.

Note: The if statement must be written in the lowercase letters. The use of Uppercase letters (If or IF) will cause a JavaScript error.

Flowchart

ES6 Decision-Making

For example

snippet
var  x = 78;
if (x>70) { 
   console.log("x is greater") 
}

Output

Output
x is greater

The if….else statement

An if….else statement includes two blocks that are if block and else block. It is the next form of the control statement, which allows the execution of JavaScript in a more controlled way. It is used when you require to check two different conditions and execute a different set of codes. The else statement is used for specifying the execution of a block of code if the condition is false.

Syntax

snippet
if (condition)
 {
  // block of code will execute if the condition is true
}
 else
 {
  // block of code will execute if the condition is false
}

If the condition is true, then the statements inside if block will be executed, but if the condition is false, then the statements of the else block will be executed.

Flowchart

ES6 Decision-Making

For example

Let us try to understand if….else statement by the following example:

snippet
var x = 40, y=20; 
if (x < y) 
{ 
   console.log("y is greater"); 
} 
else 
{ 
   console.log("x is greater"); 
}

Output

Output
x is greater

The if….else if…..else statement

It is used to test multiple conditions. The if statement can have multiple or zero else if statements and they must be used before using the else statement. You should always be kept in mind that the else statement must come after the else if statements.

Syntax

snippet
if (condition1) 
{
  //  block of code will execute if condition1 is true
}
 else if (condition2) 
{
  //  block of code will execute if the condition1 is false and condition2 is true
} 
else 
{
  //  block of code will execute if the condition1 is false and condition2 is false
}

Example

snippet
var a = 10, b = 20, c = 30; 
if( a > b && a > c) { 
   console.log("a is greater"); 
} else if( b > a && b > c ) { 
    console.log("b is greater"); 
} else { 
    console.log("c is greater"); 
}

Output

Output
c is greater

The nested if statement

It is an if statement inside an if statement.

Syntax

snippet
if (condition1) 
{ 
Statement 1; //It will execute when condition1 is true
if (condition2)
 { 
Statement 2; //It will execute when condition2 is true
}
else
{
 Statement 3; //It will execute when condition2 is false
}
}

Example

snippet
var num = 20;
if (num > 10)
{
if (num%2==0)
console.log( num+ " is greater than 10 and even number");
else
console.log(num+ " is greater than 10 and odd number");
}
else
{
console.log(num+" is smaller than 10");
}
console.log("After nested if statement");

Output

Output
20 is greater than 10 and even number After nested if statement

The switch statement

It is a multi-way branch statement that is also used for decision-making purposes. In some cases, the switch statement is more convenient than if-else statements. It is mainly used when all branches depend upon the value of a single variable. It executes a block of code depending upon the different cases.

The switch statement uses the break or default keywords, but both of them are optional. Let us define these two keywords:

break: It is used within the switch statement for terminating the sequence of a statement. It is optional to use. If it gets omitted, then the execution will continue on each statement. When it is used, then it will stop the execution within the block.

default: It specifies some code to run when there is no case match. There can be only a single default keyword in a switch. It is also optional, but it is recommended to use it as it takes care of unexpected cases.

If the condition passed to switch doesn't match with any value in cases, then the statement under the default will get executed.

Some points to remember

  • There can be one or multiple case values for a switch expression.
  • The use of break and default keywords are optional.
  • The case statements can only include constants and literals. It cannot be an expression or a variable.
  • Unless you put a break after the code of every block, the execution will continuously flow into the next block.
  • It is not necessary that the default case has to be placed at last in a switch block.

Syntax

snippet
switch(expression){    
case value1:    
 //code to be executed;    
 break;  //optional  
case value2:    
 //code to be executed;    
 break;  //optional  
......    
    
default:     
 code to be executed if all cases are not matched;    
}

Flowchart

ES6 Decision-Making

Example

snippet
var num = 5; 
switch(num) { 
    case 0 : { 
      console.log("Sunday"); 
      break; 
   } 
   case 1 : { 
    console.log("Monday"); 
    break; 
 } 
   case 2 : { 
    console.log("Tuesday"); 
    break; 
 }    
   case 3 : { 
    console.log("Wednesday"); 
    break; 
 }
   case 4 : { 
    console.log("Thursday"); 
    break; 
 } 
   case 5 : { 
    console.log("Friday"); 
    break; 
 } 
   case 6 : { 
    console.log("Saturday"); 
    break; 
 }    
   default: { 
      console.log("Invalid choice"); 
      break;              
   } 
}

Output

Output
Friday
Related Tutorial
Follow Us
https://www.facebook.com/Rookie-Nerd-638990322793530 https://twitter.com/RookieNerdTutor https://plus.google.com/b/117136517396468545840 #
Contents