Truthiness, null & undefined

Whenever JavaScript needs a yes/no answer — in an if, a loop condition or a && — it converts the value to a boolean. Values that become false are called "falsy" and everything else is "truthy". This lesson also untangles JavaScript's two "empty" values, null and undefined.

The falsy values

There are only eight. Memorise this list — everything not on it is truthy:

const values = [false, 0, "", null, undefined, NaN, "0", "false", " ", [], {}, -1];

for (const v of values) {
  console.log(JSON.stringify(v) ?? String(v), "→", v ? "truthy" : "falsy");
}

false → falsy
0 → falsy
"" → falsy
null → falsy
undefined → falsy
null → falsy
"0" → truthy
"false" → truthy
" " → truthy
[] → truthy
{} → truthy
-1 → truthy

(JSON.stringify prints NaN as null, which is why the sixth line reads "null".) The surprising truthy values are the strings "0" and "false", a string containing only a space, and empty arrays and objects.

Truthiness in practice

Truthiness makes short checks possible:

function greet(name) {
  if (!name) return "Hello, stranger";
  return `Hello, ${name}`;
}

console.log(greet("Ana"));
console.log(greet(""));
console.log(greet());

const cart = [];
console.log(cart.length ? "Checkout" : "Your cart is empty");

Hello, Ana
Hello, stranger
Hello, stranger
Your cart is empty

An empty array is truthy, so check array.length, not the array itself.

undefined vs null

Both mean "no value", but they arrive differently:

• undefined is JavaScript's default: a declared variable with no value, a missing property, a missing function argument, or a function with no return.
• null is something you (or an API) set on purpose to say "intentionally empty".

let notSet;
const obj = { a: 1 };
function nothing() {}
function show(x) { return x; }

console.log(notSet);
console.log(obj.b);
console.log(nothing());
console.log(show());

let selectedUser = { id: 7 };
selectedUser = null;
console.log(selectedUser);

undefined
undefined
undefined
undefined
null

Browser APIs typically return null for "not found" — document.querySelector does, for example — while missing things in plain JavaScript are undefined.

Checking for "no value"

const values = [null, undefined, 0, ""];

for (const v of values) {
  console.log(
    String(JSON.stringify(v)).padEnd(10),
    "=== null:", v === null,
    "| == null:", v == null,
    "| ?? fallback:", JSON.stringify(v ?? "fallback")
  );
}

null       === null: true | == null: true | ?? fallback: "fallback"
undefined  === null: false | == null: true | ?? fallback: "fallback"
0          === null: false | == null: false | ?? fallback: 0
""         === null: false | == null: false | ?? fallback: ""

• value === null / value === undefined — exactly one of them.
• value == null — either one (the one accepted use of loose equality).
• value ?? fallback — use a default only for null/undefined.
• value?.prop — read safely through a possibly-missing value.

Errors from missing values

Reading a property of undefined or null is the single most common JavaScript runtime error:

const settings = {};
console.log(settings.theme);
console.log(settings.theme.color);

undefined
Uncaught TypeError: Cannot read properties of undefined (reading 'color')

Reading settings.theme is fine — it's just undefined. Going one level deeper crashes. Fix it with optional chaining: settings.theme?.color.

Try it yourself