Conditional Statements

1. Introduction

Programs must make decisions based on inputs and state. JavaScript provides conditional statements to execute different branches of code depending on whether expressions evaluate to truthy or falsy values.

2. Why It Matters

Writing clean conditionals ensures your application handles business logic paths correctly, avoids deeply nested "pyramids of doom", and simplifies maintenance.

3. Real-World Analogy

Think of a Highway Toll Booth:

• if-else (Simple Gate): If you have an electronic pass (Fastag/EZPass), the gate opens automatically. Otherwise, you must pull into the cash lane.
• switch (Multi-Lane Junction): Signs route trucks to Lane 1, passenger cars to Lane 2, motorcycles to Lane 3, and emergency vehicles to Lane 4. Everyone goes to their designated lane immediately.

4. How It Works

JavaScript offers three primary branching patterns:

1. if / else-if / else:

Evaluates boolean expressions sequentially from top to bottom.

2. switch Statement:

Performs strict quality checks (===) against multiple case values. Needs break keywords to prevent falling through to subsequent cases.

3. Ternary Operator:

Shorthand inline conditional expression returning one of two values: condition ? valueIfTrue : valueIfFalse.

5. Internal Architecture

The JS runtime evaluates branching conditions dynamically. When using if-else, conditions are tested sequentially, which can lead to O(N) execution checks. When using switch, many JS engines build a jump table internally to optimize execution, providing direct jumps to matching branches (O(1) efficiency) when there are many cases.

6. Practical Example

Here is an example demonstrating clean conditional handling and early return patterns:

7. Common Mistakes

• Missing breaks in switch statements: Forgetting the break statement causes execution to fall through into subsequent case blocks, running unintended code.
• Deep nesting: Nesting multiple layers of if statements makes code unreadable. Refactor code using guard clauses or early returns.

8. Quick Quiz

9. Scenario-Based Challenge

10. Debugging Exercise

function getAccessLevel(user) {
  if (user.isAdmin || user.isModerator) {
    if (user.isSuspended) {
      console.log('Blocked');
    }
    console.log('Admin access granted'); // prints this even if suspended!
  }
}

function getAccessLevel(user) {
  if (user.isSuspended) {
    console.log('Blocked');
    return; // Exit early!
  }
if (user.isAdmin || user.isModerator) {
    console.log('Admin access granted');
  }
}

11. Interview Questions

12. Production Considerations

• • Lookup Tables: When dealing with mapping actions or mapping states (e.g., config types to components), use object literals or ES Maps instead of multi-case switch statements to make code modular and extendable.