Conditional Statements in JavaScript
if, else if, else, and switch

Understanding Conditional Statements in JavaScript

At the core of any dynamic program lies decision-making. JavaScript gives you the tools to evaluate expressions and conditionally execute blocks of code using conditional statements. These include if, else if, else, and switch — each powerful in their own use case.

The if Statement

The if statement is the most basic form of control structure. It allows your code to make decisions based on a condition that evaluates to true or false.

let age = 20;
if (age >= 18) {
  console.log("You are eligible to vote.");
}

You are eligible to vote.

The if-else Statement

When you want to do something if the condition is true, and something else if it's false, use if-else.

let isRaining = false;
if (isRaining) {
  console.log("Take an umbrella.");
} else {
  console.log("Enjoy the sunshine!");
}

Enjoy the sunshine!

The if-else if-else Ladder

Sometimes, multiple conditions need to be tested sequentially. The if-else if-else structure handles this elegantly.

let score = 85;
if (score >= 90) {
  console.log("Grade: A");
} else if (score >= 75) {
  console.log("Grade: B");
} else if (score >= 60) {
  console.log("Grade: C");
} else {
  console.log("Grade: F");
}

Grade: B

Truthy and Falsy Values in JavaScript

In JavaScript, conditions don’t need to be strictly true or false. Some values are considered truthy (evaluate to true), while others are falsy (evaluate to false).

• Falsy values: false, 0, "", null, undefined, NaN
• Truthy values: Everything else

let username = "";
if (username) {
  console.log("Username is set");
} else {
  console.log("Username is empty");
}

Username is empty

The switch Statement

When you're checking a single value against many possible matches, switch becomes more readable and efficient than a long if-else ladder.

let fruit = "apple";
switch (fruit) {
  case "banana":
    console.log("Bananas are yellow.");
    break;
  case "apple":
    console.log("Apples are red or green.");
    break;
  case "orange":
    console.log("Oranges are orange.");
    break;
  default:
    console.log("Unknown fruit.");
}

Apples are red or green.

Best Practices with switch

• Always include break to prevent fall-through unless explicitly desired.
• Use default to catch unmatched cases.

Nested Conditional Statements

Sometimes, conditions are dependent on one another. In such cases, you can nest conditionals.

let age = 22;
let hasLicense = true;

if (age >= 18) {
  if (hasLicense) {
    console.log("You can drive.");
  } else {
    console.log("You need a license to drive.");
  }
} else {
  console.log("You are too young to drive.");
}

You can drive.

Ternary Operator – A Shortcut

The ternary operator is a compact way to write simple if-else conditions:

let access = age >= 18 ? "Granted" : "Denied";
console.log(access);

Granted

When to Use What?

Use	Statement
Single condition	if
Two outcomes	if-else
Multiple ranges or values	if-else if or switch
Compact, simple logic	ternary

Real-World Use Case Example

Imagine a login system where we verify if a user is admin, user, or guest:

let role = "admin";

if (role === "admin") {
  console.log("Access to admin dashboard.");
} else if (role === "user") {
  console.log("Access to user dashboard.");
} else {
  console.log("Access denied.");
}

Access to admin dashboard.

Summary

Conditional statements are the decision-makers in your JavaScript applications. Whether you're showing a message, calculating a grade, or toggling UI elements, mastering if, else, switch, and the ternary operator gives you control over program flow with precision and elegance.

Practice with different scenarios — change variables, test edge cases, and mix conditions. These seemingly simple statements are your gateway to logic-driven applications.