A conditional statement refers to a piece of code that does the things based on some condition. When we write code, we will often need to use these conditional statements. There are besically four types of conditional statements-
The if statement is used to execute a block of code only if the specified condition is true.
if(condition) {
statement;
}if(7 > 5) {
console.log('True');
}if(condition) {
statement 1;
} else {
statement 2;
}if(5 > 7) {
console.log('True');
} else {
console.log('False');
}The if-else-if statement is used to execute a block of code only if the specified condition is true from the several condition.
if(condition) {
statement 1;
} else if {
statement 2;
} else {
statement 3;
}if(5 > 7) {
console.log('Greater');
} else if (5 == 7) {
console.log('Equals');
} else {
console.log('Smaller');
}The switch case statement evaluates an expression, and then matching its value to a case clause, once match case is found, it executes statements associated with that case.
switch(expression) {
case value 1:
statement;
break;
case value 2:
statement;
break;
default:
statement;
}let value = 2;
switch (value) {
case 1:
console.log('Too small');
break;
case 2:
console.log('Exactly!');
break;
case 3:
console.log('Too large');
break;
default:
console.log('Unknown');
}The ternary operator is a concise one-liner alternative to if-else for simple conditions.
// Syntax: condition ? valueIfTrue : valueIfFalse
const age = 20;
const status = age >= 18 ? 'Adult' : 'Minor';
console.log(status); // Adult
// Nested ternary (use sparingly - can reduce readability)
const score = 75;
const grade = score >= 90 ? 'A'
: score >= 80 ? 'B'
: score >= 70 ? 'C'
: 'F';
console.log(grade); // C
// Ternary in JSX / template literals
const isLoggedIn = true;
const message = `Welcome, ${isLoggedIn ? 'User' : 'Guest'}!`;
console.log(message); // Welcome, User!function getGrade(score) {
if (score < 0 || score > 100) {
return 'Invalid score';
} else if (score >= 90) {
return 'A - Excellent';
} else if (score >= 80) {
return 'B - Good';
} else if (score >= 70) {
return 'C - Average';
} else if (score >= 60) {
return 'D - Below Average';
} else {
return 'F - Fail';
}
}
console.log(getGrade(95)); // A - Excellent
console.log(getGrade(72)); // C - Average
console.log(getGrade(45)); // F - Fail
// Same logic with switch on grade band
function getDayName(day) {
switch (day) {
case 1: return 'Monday';
case 2: return 'Tuesday';
case 3: return 'Wednesday';
case 4: return 'Thursday';
case 5: return 'Friday';
case 6: return 'Saturday';
case 7: return 'Sunday';
default: return 'Invalid day';
}
}
console.log(getDayName(5)); // FridayExplore 500+ free tutorials across 20+ languages and frameworks.