Decisions: if, else and switch

Mission 4, step 5. Today your code learns to decide: one message for a new visitor, another when a form is empty.

Quick check

Quick recall

10 XP

Comparing values

A comparison asks a question about two values. The answer is true or false.

Operator	Meaning	Example
===	Same value and same type (use this)	5 === "5" is false
==	Equal after changing the types	5 == "5" is true
!== / !=	Not equal (with / without the type)	5 !== "5" is true
> < >= <=	Bigger, smaller, or equal	10 >= 10 is true

The slides say that == does not look at the type. More exactly, it first changes the types, then compares. That can surprise you, so use === and !==.

Logical operators join conditions. (The slide calls them comparison operators.) && (and): all parts must be true, like password right and user name right. || (or): one is enough, like cash or card. ! (not) turns true into false.

Grouping

True or false?

Required 15 XP

if, else if and else

let points = 85;
if (points >= 90) {
  console.log("Grade: A");
} else if (points >= 80) {
  console.log("Grade: B");
} else {
  console.log("Not passed yet. Try again.");
}

The first true condition wins, so the order matters. else catches the rest.

For a short choice between two values, use the ternary operator: condition ? value if true : value if false.

let result = points > 50 ? "Passed" : "Try again";

On the slide, the long and the short version stand in one block and create the same variables twice, which stops with an error. They are two separate examples.

Worked example: the cash machine

Sorting

The cash machine plan

Required 15 XP

The slide's code has a bug: the balance never changes. This counts for the Bug Hunter badge.

Practice

Slide bug: the money machine

Required 30 XP

This code comes from a course slide. It has a small bug. Find it and fix it.

Many exact values: switch

let day = 3;
switch (day) {
  case 1: console.log("Monday"); break;
  case 2: console.log("Tuesday"); break;
  case 3: console.log("Wednesday"); break;
  default: console.log("Not a day number");
}

case 3: runs when day is exactly 3. break means "found it, stop": without it, the next case runs too. default runs when no case fits, like else. On the slide, the console.log() after default: stands inside a comment, so an unknown day prints nothing.

Practice

Day name

Required 30 XP

From slide 63 of the course: put the lines of the switch in order. Day 3 should print Wednesday and nothing else.

Condition

A question that is true or false, like points >= 90.

Logical operator

Joins conditions: &&, ||, !.

Ternary operator

A short if-else that gives one of two values.

switch

Chooses a case by an exact value; break stops.

In short

• Use === and !==: they check the value and the type.
• && needs all parts true, || needs one, ! turns it around.
• if, else if, else: the first true condition wins.
• switch for exact values, with break after each case.

Sources

1. MDN Web Docs (2026). Equality comparisons and sameness.
2. MDN Web Docs (2026). Expressions and operators (logical operators).
3. MDN Web Docs (2026). Making decisions in your code: conditionals.
4. MDN Web Docs (2026). Conditional (ternary) operator and switch.