Techie BabajiLearn to Code. Build Real Skills.
JavaScript · Control Flow

Conditional Statements

Programs make decisions. Conditional statements let your code take different paths depending on the situation.

Beginner 5 min Lesson 7 of 49 Runnable examples
Before you start:Operators
0/49 in JavaScript
On this page · 5 min · Beginner

On this page

  1. Learning objectives
  2. Explanation
  3. Syntax
  4. Code example
  5. Step by step
  6. Real-world use
  7. Common mistakes
  8. Best practices
  9. Remember this
  10. Practice exercise
  11. Mini quiz
  12. Related topics
  13. My notes
Reading time
5 min
Difficulty
Beginner
Updated
Oct 27, 2026

Related tutorials

Interview questions

Learning objectives#

  • Write if, else if and else blocks
  • Use switch for many fixed values
  • Use truthy and falsy values in conditions
  • Simplify logic with early returns

Explanation#

if (condition) { … } runs the block only when the condition is true. else if checks another condition; else catches everything left.

Conditions are checked top to bottom, and only the first matching block runs — so order matters.

switch compares one value against many cases. Remember break, or execution “falls through” into the next case.

Conditions do not need to be true/false: falsy values (0, "", null, undefined, NaN, false) act as false; everything else acts as true.

Syntax#

JavaScript Illustrative
if (condition) {
  // runs when true
} else if (other) {
  // …
} else {
  // otherwise
}

Code example: Grading students#

JavaScriptGrading students Runnable
function grade(score) {
  if (score >= 90) return 'A';
  else if (score >= 75) return 'B';
  else if (score >= 50) return 'C';
  else return 'Fail';
}
console.log(grade(95), grade(80), grade(60), grade(30));


const day = 'sat';
switch (day) {
  case 'sat':
  case 'sun':
    console.log('Weekend!');
    break;
  default:
    console.log('Weekday');
}
Expected output
A B C Fail
Weekend!
Opens this example in the full playground

Step-by-step explanation#

  1. grade(95) matches the first condition and returns "A" immediately.
  2. grade(80) skips the first check, matches score >= 75 → "B".
  3. Because checks go from highest to lowest, each score lands in the right band.
  4. In the switch, 'sat' and 'sun' share one block; break stops execution there.

Real-world use case#

Showing free delivery when the order is over ₹499, choosing a greeting by time of day, or routing users by role (admin, teacher, student).

Common mistakes#

Wrong order of conditions

Checking score >= 50 before score >= 90 makes everyone above 50 a “C”. Put the most specific condition first.

Forgetting break in switch

Without break, the code continues into the next case and runs it too.

Best practices#

  • Order conditions from most specific to least specific
  • Use early returns (guard clauses) to avoid deep nesting
  • Use switch or an object lookup for many fixed values
  • Always use braces for multi-line blocks

Remember this#

if checks top to bottom and stops at the first true.

switch needs break — otherwise it “falls through”.

Falsy six: false, 0, "", null, undefined, NaN. Everything else is truthy.

Practice exercise#

Your task: Write getDiscount(total): 20% for 5000+, 10% for 2000+, otherwise 0. Print results for 6000, 2500 and 500.

Show solution
JavaScript Runnable
function getDiscount(total) {
  if (total >= 5000) return 0.2;
  if (total >= 2000) return 0.1;
  return 0;
}
console.log(getDiscount(6000), getDiscount(2500), getDiscount(500)); // 0.2 0.1 0
Opens this example in the full playground

Mini quiz#

Conditional Statements quizPredict the output Question 1 of 1

What is printed?

const x = 0;
if (x) console.log('yes');
else console.log('no');
Score so far: 0/0

Want more? Practise all JavaScript MCQs · JavaScript interview questions

My notes#

Saved in this browser.

Progress is saved in this browser. Sign in to sync.