Skip to content
Foxipa

Suggest an edit

Tell us what should be corrected, clarified, or improved. Submission will be connected to Foxipa’s contribution service later.

No information is sent anywhere yet. Your suggestion is only prepared in your browser.

Learning

JavaScript Booleans and Conditionals

Learn how JavaScript decides: === versus ==, the short-circuit logic operators, truthiness and its falsy list, and the if and switch statements.

Levels: Beginner ~15 min read

Basic

JavaScript's conditionals look familiar from other languages and then add two twists of its own. The first is a pair of equality operators with different philosophies, and a settled community answer about which to use. The second is an aggressively helpful type conversion, applied almost anywhere a value meets a condition, which is why JavaScript's small falsy list is worth memorizing word for word.

=== and the operator it retired

Three equals compare value and type with no conversions: 5 === "5" is false, and that clarity is why strict equality is the community default , written without comment in every serious codebase. Its two-equal sibling applies a conversion table before comparing, so 5 == "5" is true and "" == 0 is true, and the table is long enough that nobody holds it in their head honestly. The one defensible job left for == is testing against both null and undefined at once, value == null, a habit some codebases keep and most simply replace with an explicit pair of strict checks.

Logic that short-circuits

&& returns when both sides are truthy, || when either is, and both stop evaluating at the moment the answer is known, the property that makes orders && orders.length a safe two-part test. The modern ??, nullish coalescing, fills in a default only for null or undefined, leaving 0 and "" alone, which || would have swallowed: count || 10 turns a legitimate zero into ten, count ?? 10 keeps it. Choosing between them is choosing whether zero and empty string mean something in your data, and they usually do.

Truthiness and the falsy seven

Any value can stand in a condition. The falsy list is short and worth reciting: false, null, undefined, 0 and NaN, and the empty string "". Everything else is truthy, including "0", "false", and every array, including the empty array , a trap for anyone arriving from Python, where empty containers are falsy. When the emptiness of an array is the question, ask it directly with items.length === 0.

if, else if, else, and switch

javascript branches.js
1
2
3
4
5
6
7
if (loaves === 0) {
  console.log("Sold out");
} else if (loaves < 5) {
  console.log("Last few loaves");
} else {
  console.log("Baking along nicely");
}

The ladder, tested top to bottom, one block runs.

Braces around block bodies are optional for single statements and always worth writing anyway; the omitted-brace bug, a second line silently outside the branch, has embarrassed every long career. When a dozen branches all test the same expression against fixed values, switch with case labels and explicit break statements states the shape more plainly, and forgetting a break makes execution fall through into the next case, occasionally useful, famously error-prone, always worth a comment when intended.

Put the machinery to work

The example below is an order gate combining the lesson's tools, writing to the preview console. Run it, then change the facts at the top and predict each line before running again. Two experiments pay for themselves: set discount to 0 and watch || replace it with 10 while ?? keeps it, the whole lesson in one line; and change if (hour === 8) to the single-equals typo to see the branch run with no complaint from anyone.

Interactive Runnable example
Edit

Ready to run.

What to notice

  • Exactly one ladder rung ran, the first whose condition held.

  • The orders && orders.length line never crashed on an empty array, because && stopped at the first falsy fact.

  • Zero survived ?? and was replaced by ||, the distinction that decides which one a default belongs to.


Quick check

If you can recite the falsy list, explain when ?? beats ||, and say why the single-equals condition runs instead of failing, your programs can decide safely. Next, functions. When you are ready, take the Booleans and Conditionals quiz.

Was this page helpful?

Mark this learning resource complete to track your learning progress.