Javascript
JavaScript Conditional Statements
JavaScript lets you write code statements that work depending on the output of logical or comparative conditions during execution.
In other words, we can say that it allows you to create test conditions that conclude to either true or false, depending on which you can carry out specific tasks.
JavaScript offers the following types of conditional statements:
Example:
- The if statement
- The if...else statement
- The if...else if....else statement
- The switch...case statement
The if Statement: When a specific condition is true, you can use the if statement to run a piece of code.
Syntax:
if(condition) {
// Code to be executed
}
Example:
var x = new Date();
var dayOfWeek = now.getDay(); // Sunday - Saturday : 0 - 6
if(dayOfWeek == 6) {
document.write("Saturday!");
}
The if...else Statement: When a condition is true, a specific block of code is executed. If it evaluates to false, the other block of code is executed.
Syntax
if(condition) {
// Code to be executed if condition is true
} else {
// Code to be executed if condition is false
}
Example:
var x = new Date();
var dayOfWeek = now.getDay(); // Sunday - Saturday : 0 - 6
if(dayOfWeek == 6) {
document.write("Saturday!");
} else {
document.write("Have a nice day!");
}
The if...else if...else Statement: When you need to combine a group of if..else statements, use the if…else if…else statement.
Example:
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 both condition1 and condition2 are false
}
Example:
var now = new Date();
var dayOfWeek = now.getDay(); // Sunday - Saturday : 0 - 6
if(dayOfWeek == 6) {
document.write("Saturday!");
} else if(dayOfWeek == 2) {
document.write("Monday!");
} else {
document.write("Good day!");
}
The Ternary Operator: If you want to use the if…else statements in a shorthand manner, use the ternary operator.
Syntax:
var result = (condition) ? value1 : value2
The syntax of a ternary operator includes a question mark, and three operands which include the condition to be tested, a value for true, and a value for false.
If the condition is true, it returns value1, else value 2 is returned.
Example:
var userType;
var age = 12;
if(age > 18) {
userType = 'Eligible for voting';
} else {
userType = 'Not Eligible for voting';
}
document.write(userType); // Prints Not Eligible for voting
You can use the ternary operator to simplify the above code:
var age = 12;
var userType = age > 18 ? 'Eligible for voting' : 'Not Eligible for voting';
document.write(userType); // Prints Not Eligible for voting
JavaScript Switch...Case Statements: The switch…case statement can be described as a substitute to the if…else if…else statement. It checks a condition for a set of values until a match is found. The code following the match is executed.
Syntax:
switch(x){
case value1:
// Code to be executed if x === value1
break;
case value2:
// Code to be executed if x === value2
break;
...
default:
// Code to be executed if x is different from all values
}
Example:
var day = new Date();
switch(day.getDay()) {
case 0:
document.write("Sunday");
break;
case 1:
document.write("Monday");
break;
case 2:
document.write("Tuesday");
break;
case 3:
document.write("Wednesday");
break;
case 4:
document.write("Thursday");
break;
case 5:
document.write("Friday");
break;
case 6:
document.write("Saturday");
break;
default:
document.write("Have a Good day.");
break;
}
What is the difference between switch..case statement and if…else statement?
The switch statement works line by line. When it finds a case clause that is true, it executes the code following it, and also runs all the succeeding case clauses up to the end of the switch block.
To overcome this, use the break statement following every case. The break statement instructs the interpreter to end the switch…case statement when a match is found and subsequent code is executed.
You don’t need to specify the break statement for the default clause or the case that comes at the end. However, if you do that it reflects your clean programming practices. Also it reduces the probability of errors if you need to add another case statement to the switch statement.
The default clause allows you to specify the actions that should be executed when no case matches are found. It may not necessarily be the last clause in the switch statement.
Example:
var day = new Date();
switch(day.getDay()) {
default:
document.write("It's weekend.");
break;
case 6:
document.write("Saturday");
break;
case 0:
document.write("Sunday");
}
JavaScript allows different cases to share the same action. However, the case value needs to be distinct.
Example
var day = new Date();
switch(day.getDay()) {
case 1:
case 2:
case 3:
case 4:
case 5:
document.write("Weekday");
break;
case 0:
case 6:
document.write("Weekend");
break;
default:
document.write("Have a good day.");
}