Coercive Conditional Comparison

Yes, that section name is quite a mouthful. But what are we talking about? We’re talking about conditional expressions needing to perform coercion-oriented comparisons to make their decisions.

if and ? :-ternary statements, as well as the test clauses in while and for loops, all perform an implicit value comparison. But what sort? Is it “strict” or “coercive”? Both, actually.

Consider:

var x = 1;
if (x) {
    // will run!
}
while (x) {
    // will run, once!
    x = false;
}

You might think of these (x) conditional expressions like this:

var x = 1;
if (x == true) {
    // will run!
}
while (x == true) {
    // will run, once!
    x = false;
}

In this specific case — the value of x being 1 — that mental model works, but it’s not accurate more broadly. Consider:

var x = "hello";
if (x) {
    // will run!
}
if (x == true) {
    // won't run :(
}

Oops. So what is the if statement actually doing? This is the more accurate mental model:

var x = "hello";
if (Boolean(x) == true) {
    // will run
}
// which is the same as:
if (Boolean(x) === true) {
    // will run
}

Since the Boolean(..) function always returns a value of type boolean, the == vs === in this snippet is irrelevant; they’ll both do the same thing. But the important part is to see that before the comparison, a coercion occurs, from whatever type x currently is, to boolean.

You just can’t get away from coercions in JS comparisons. Buckle down and learn them.