Conditionals
Conditional statements are used to run different sets of statements according to the conditions. This means that based upon various conditions, we can perform different actions. These are the same as used in other languages.
In JavaScript, we have the following conditional statements:
- Use if to specify a block of code to be executed if a specified condition is true.
- Use else to specify a block of code to be executed if the same condition is false.
- Use else if to specify a new condition to test, if the first condition is false
- Use the switch to specify many alternative blocks of code to be executed.
if Statements
The if statement specifies a block of statements (JavaScript code) that gets executed
when the condition specified in the if statement evaluates to true.
Syntax : if (condition) {
//block of code to be executed if the condition is true
}
First, the condition is evaluated, and if it is true, then the statements inside it are
executed. Else if the condition is false, statements inside 'if' are not executed.
Example: Print Coding Ninjas if marks are greater than 90
if(marks>90){
console.log(“Coding Ninjas”);
}
if-else Statements
The if statement specifies a block of statements (JavaScript code) that gets executed
when the condition specified in the if statement evaluates to true.
Else, if the condition is false, then the statements inside the else block are executed.
Syntax : if (condition) {
//code to be executed if condition1 is true
} else {
//code to be executed if the condition is false
}
Example: Print Good if marks are greater than 90, else Bad
if(marks>90){
console.log(“Good”);
}else{
console.log(“Bad”);
}
else-if Statements
The above two works for only two options, i.e. whether the condition is true or false.
Using else-if, we can define more than one condition and form a chain. The first
condition that returns true gets executed, else the last 'else' block is executed.
Syntax : if (condition1) {
// code to be executed if condition1 is true
} else if (condition2) {
// code to be executed if the condition1 is false and condition2 is true
} else {
// code to be executed if the condition1 is false and condition2 is false
}
Now the first condition is checked. If it evaluates to true, it gets executed and other
else if blocks are not checked. If the first condition is false, then the second condition is
checked.
Like this, each if condition is checked one by one until one is true or the else block is
reached. If any one of them is true, the block associated with it gets executed. Else the
else block is executed.
Example : If marks <50 then print bad , if marks <80 print average , if marks >= 80 print good
if (marks < 50) {
console.log(“Bad”);
} else if (marks < 80) {
console.log(“Average”);
} else {
console.log(“Good”) ;
}
Switch Statement
The switch statements are similar to else-if statements but work on a single
expression. This expression evaluates different values which decide which block of
code needs to be executed.
Syntax : switch(expression) {
case x:
// code block
break;
case y:
// code block
break;
default:
// code block
}
Work Flow of Switch Statements :
- The switch expression is evaluated once.
- The value of the expression is compared with the values of each case.
- If there is a match, the associated block of code is executed.
- If there is no match, the default code block is executed.
Example : const course= 'Web-Dev';
switch (course) {
case ‘DSA’:
console.log('Your course is DSA');
break;
case ‘Web-Dev’:
console.log('Your course is Web-Dev’);
break;
default:
console.log(`Sorry, course not found`);
}
Output: Your course is Web-Dev
break Keyword
We have provided a break; statement after each case is completed to stop the
execution of the switch block. If the break is not present, then the cases after the one that matches also get executed until a break; is found or the switch block does not end.
Note: If you omit the break statement, the following case will be executed even if the evaluation does not match the case.
default Keyword
The default keyword specifies the code to run if there is no case match
If the course would’ve been ‘Android’ in the above example, then the code would’ve printed “Sorry, course not found.”
default case does not have to be the last case in a switch statements
Example: const course=’Android ’;
switch (course) {
default:
console.log(`Sorry, course not found`);
break; // Mandatory
case ‘DSA’:
console.log('Your course is DSA');
break;
case ‘Web-Dev’:
console.log('Your course is Web-Dev’);
break;
}
Output: Sorry, course not found
Note: If the default is not the last case in the switch block, remember to end the default case with a break
Points to Remember
- If multiple cases have the same case value, the first case is selected.
- If no matching cases are found, the program continues to the default label.
- If no default label is found, the program continues to the statement(s) after the switch.
Strict Comparison
- Switch cases use strict comparison (===), i.e. the same values must match the switch case value.
Example : let temp = “1” ; //type String
switch (temp) {
case 0:
console.log(“Number is 0”) ;
break;
case 1:
console.log(“Number is 1”) ;
break;
default:
console.log(“Number not found”) ;
}
Output: Number not found
Common Code Blocks for Different Switch Case Values
Sometimes you will want different switch cases to use the same code
In the below Example for both HTML and CSS course assigned is Web-Dev
Example: const language = ’HTML ’ ;
switch (language){
case ‘HTML’ :
case ‘CSS’ :
console.log('Your course is Web-Dev’);
break;
case ‘KOTLIN’ :
console.log('Your course is Android’);
break;
default:
console.log(`Sorry, course not found`);
}
Output: Your course is Web-Dev