Conditional statements in JavaScript are used to make decisions in code and perform the necessary action. Conditional statements control behavior and determine whether or not pieces of code should run.
Decision-making in code requires us to specify one or more conditions to be evaluated or tested by the program with a statement to be executed if the program is true and another statement to be executed if a condition is false.
The conditionals in JavaScript include:
If statements: Used to specify execution of a block of code when the condition is true.
Else statements: Used to specify execution of a block of code when the same condition is false.
Else if statements: Used to specify a new test if the first condition is false.
Switch statements: Used to test a value against a variety of choices. An alternative for if-else statements in scenarios where they would be tiresome.
Ternary operators: Same as if-else statements only that they have a shorter syntax.
Statements in a program file are read from top to bottom by default.
If statements
This is the most common type of conditional statement. It only executes if the condition in the curly braces is true. The conditions are Boolean conditions which means they may either be true or false.
Pseudocode
if (condition is true) {
statement is executed
}
Example
let age = prompt('Enter your age');
if (age >=18) {
alert("Eligible to vote");
}
If the age is 18 and over, the block of code inside the curly braces will execute, and if the age is less than 18, the block of code won't execute.
If else statement
Here if the condition is true, the code in the if statement is executed, else the code in the else statement will be executed.
Pseudocode
if (condition) {
lines of code to be executed when the condition is true
} else {
lines of code to be executed when the condition is false
}
Example
let age = prompt('Enter your age');
if (age >=18) {
alert("Eligible to vote");
} else {
alert("Not eligible to vote");
}
If the age is 18 and over, the person is eligible to vote, and if the age is less than 18, the person is not eligible to vote.
Else if statements
Sometimes you would want to test several or multiple conditions. The else if clause helps with this to chain the if-else statements.
function getRemarks(marks) {
if (marks < 50) {
return "Student is poor";
} else if (marks >= 50 && marks < 80) {
return "Student is average";
} else {
return "Student is excellent";
}
}
getRemarks(75);
Result
Student is average
Switch statements
If-else statements are good for decision making in code but they have got their downsides too. They are good when you have got a couple of choices and each choice has got a block of code to execute. For cases where you have multiple choices and you want to print out a particular statement depending on a condition, the syntax can be a bit tiresome.
In such a scenario, we use switch statements which are an alternative to if-else statements. Switch statements take a single expression/value as input and then look through a number of choices until they find one that matches that value which will execute the corresponding code.
Pseudocode
switch(expression) {
case choice1:
// run this code
break;
case choice2:
// run this code instead
break;
// include as many cases as you want
default:
// actually run this code
}
The switch keyword is followed by a parenthesis with the expression or value inside the parenthesis. The case keyword is followed by the choice that the expression could be, followed by a colon with code to run if the choice matches the expression. The break statement follows with a semi colon so that when the program stops executing the code, it moves onto the code below the switch statement. The default keyword with the code that runs if none of the choices match.
Example
function getRemarks(grade) {
let result = "";
switch(grade) {
case 'A':
return "Excellent job";
break;
case 'B':
return "Good job";
break;
case 'C':
return "Passed";
break;
case 'D':
return "Tried";
break;
case 'E':
return "Not so good";
break;
case 'F':
return "Failed";
break;
default:
return "grade unknown";
}
return result;
}
getRemarks('C');
Result
Passed
Ternary or Conditional operator
This is the same as an if-else block, only that it takes up less syntax. It tests a condition and returns one expression if the condition is true and another if the condition is false.
Pseudocode
(condition) ? run this code : run this code instead
Example
function findLower(a, b) {
return a < b ? "a is lower" : "b is lower";
}
findLower(10, 20);
Result
a is lower
Conclusion
I hope you learnt how to make decisions in code with conditional statements in this simple article. That's all. Thanks for reading!!