All topics
3 / 100
Fundamentalsbeginner

Type Coercion and Equality

How JavaScript automatically converts values between types, and why == and === behave differently.

Coercion is JavaScript converting a value's type automatically when an operator expects a different one. It is behind a lot of convenient code and most of the language's reputation.

It's like comparing a printed price tag ('$5') to a coin in your hand (5) — loose equality translates one into the other's 'currency' before comparing, while strict equality just says they're different formats and refuses to compare them at all.

Key Concepts

1
== coerces. === does not.
    '5' == 5        // true  -- the string is converted
    '5' === 5       // false -- different types, done
=====
2
    null == undefined    // true  -- a special case in the spec
    null === undefined   // false
3
The rules that cover nearly every case.
    string + anything      -> string concatenation
    - * / %                -> both converted to number
    == between number
       and string          -> the string is converted to number
    == with boolean        -> the boolean becomes 0 or 1
    null == undefined      -> true, and equal to nothing else
4
    1 + '1'        // '11'   -- + prefers the string
    '5' - 1        // 4      -- - has no string meaning
    '5' * '2'      // 10
    true + 1       // 2
5
The famous ones, explained rather than memorised.
    [] + {}     // '[object Object]'
                // [] becomes '', {} becomes '[object Object]'
6
    [] == false // true
                // [] -> '' -> 0, and false -> 0
7
Each is the same two rules applied to unusual operands. There is no separate list to learn.
8
Falsy values are a closed set of six.
    false, 0, -0, 0n, '', null, undefined, NaN
9
Everything else is truthy — including '0', 'false', [] and {}. That is the list worth knowing by heart, because if (value) is everywhere.
'0''false'[]{}if (value)
10
    if ('0')  // runs -- a non-empty string
    if ([])   // runs -- an object
11
NaN is not equal to itself.
    NaN === NaN       // false
    Number.isNaN(x)   // the correct test
    Object.is(NaN, NaN) // true
NaN
12
What to do. Use === everywhere. Convert deliberately with Number(), String() and Boolean() when you mean to.
===Number()String()Boolean()
13
The one common exception is x == null, which is true for null and undefined and nothing else — a concise way to test for "no value" that many codebases allow.
x == nullnullundefined
14
What the interviewer is probing.1. "When is == acceptable?" Probing: whether you have a rule. Stalls: "Never." Moves up: x == null is a useful idiom catching null and undefined together; otherwise === for predictability.
15
2. "Why is [] == false true?" Probing: the coercion steps. Stalls: "Both are falsy." *Moves up:* the array becomes "" then 0, and false becomes 0 — but [] is itself truthy, which is why mixing the two rules confuses people.
16
3. "What are the falsy values?" Probing: whether the set is known exactly. Stalls: "Empty things." Moves up: false, 0, -0, 0n, empty string, null, undefined and NaN — everything else, including [] and {}, is truthy.
17
4. "How does + differ from other operators in coercion?" Probing: string concatenation. Stalls: "It adds." Moves up: if either side is a string it concatenates, so 1 + "2" is "12" while 1 - "2" is -1.
Use cases:equalitycoercionfundamentals