Conditions (if/else)
📚 What are conditions in JavaScript? They let your script **branch**: run one path when something is true, another when it is false. Use `if`, `else if`, and `else` with conditions in parentheses.
Appy Says…
JavaScript has all the same conditionals as Python, but there's one powerful addition: the ternary operator. It lets you write a simple if/else in a single line — used constantly in modern React apps.
Conditions in JavaScript
JavaScript uses if / else if / else — the same logic as Python but with curly braces {} instead of indentation.
- •
if (condition) { ... }— runs when condition is truthy - •
else if (condition) { ... }— chains additional checks - •
else { ... }— the fallback - •Strict equality: use
===(not==) to compare both value AND type - •Ternary:
const label = score >= 50 ? "Pass" : "Fail";
=== vs == — strict bouncer vs lazy bouncer
The double equals == is a lazy bouncer — it accepts "5" == 5 as true because it converts types. The triple equals === is strict — it checks type AND value, so "5" === 5 is false. Always use strict equality to avoid sneaky bugs.
Real-World Examples
- •Button text:
const btnText = isLoading ? "Loading..." : "Submit"; - •Theme toggle:
const theme = isDark ? "dark" : "light"; - •Auth guard:
if (!isLoggedIn) { redirect('/login'); } - •Grade display:
if (score >= 90) grade = 'A*'; else if (score >= 80) grade = 'A'; ...
Key Facts
- •Truthy/falsy:
0,"",null,undefined,NaNare all falsy in JS — treated as False in conditions - •The
!operator negates:if (!isLoggedIn)means 'if not logged in' - •
switch (value) { case x: ... }— useful for many possible values - •Logical AND:
&&; logical OR:||; nullish coalescing:??
Remember
Always use === instead of == in JavaScript. The triple equals checks both value and type, preventing a whole class of subtle bugs that beginners (and even pros) fall into with ==.
What You Learned
- •
if () {} else if () {} else {}with curly braces (not indentation) - •Always use
===for comparison (strict, checks type too) - •Ternary:
condition ? valueIfTrue : valueIfFalse - •Falsy values:
0,"",null,undefined,NaN - •Logical operators:
&&(and),||(or),!(not)
Key Facts
- →Truthy/falsy:
0,"",null,undefined,NaNare all falsy in JS — treated as False in conditions - →The
!operator negates:if (!isLoggedIn)means 'if not logged in' - →
switch (value) { case x: ... }— useful for many possible values - →Logical AND:
&&; logical OR:||; nullish coalescing:??
Real-World Examples
Remember
Always use === instead of == in JavaScript. The triple equals checks both value and type, preventing a whole class of subtle bugs that beginners (and even pros) fall into with ==.
Quick Quiz
What do we put inside if ()?