Why if([]) is validated while [] == false in javascript?

Question

if([] == false) alert('empty array is false');
alert(+[]) // alert 0
if([]) alert('empty array is true');

They both will run the alert

Demo

Answer 1

Both current answers here are correct, but I'd like to add a more detalied explanation based on the language specification. The reason for the apparently contradictory outcomes is that if statements and equality comparisons are evaluated differently.

In the case of an if(expression) statement, the expression is evaluated and then converted to the boolean type (§ 12.5). Arrays are Objects, and when an Object is converted to Boolean, the result is always true (§ 9.2).

Equality comparisons with == follow a different set of rules, detailed on § 11.9.3. The comparison may require multiple type conversions, until both operands are the same type. The order of the operands is also important. According to that algorithm, we can see that the comparison [] == false is actually a four-step operation:

1. There is a Boolean involved, so it's converted to a Number first (step 7 of the algorithm). So it becomes:

   [] == 0
   

2. Then the array is converted to its primitive value (see § 9.1 and § 8.12.8), and becomes an empty string (step 9). So:

   "" == 0
   

3. When comparing a String to a Number, the String is converted to Number first (step 5, following the rules described on § 9.3.1):

   0 == 0
   

4. Now that we have two Numbers, the comparison evaluates to true according to step 1.c.iii.

Answer 2

It's because of type coercion of the == (equality) operator.

An empty array is considered truthy (just like an empty object), thus the second alert is called.

However, if you use ([] == false), your array is coerced to its string representation* which is "" which then is considered as a falsy value, which makes the condition true thus triggering the first alert too.

If you want to avoid type coercion, you have to use the === (identity) operator which is the preferred and by the famous Douglas Crockford promoted way to compare in javascript.

You can read more on that matter in this exhaustive answer.

*^{(Object.prototype.toString is called on it)}

EDIT: fun with JS-comparison:

NaN == false // false
NaN == true  // also false
NaN == NaN   // false

if(NaN)      // false
if(!NaN)     // true

0  == '0'     // true
'' == 0       // true
'' == '0'     // false !

This shows you the real "power" of Comparison with == due to the strange rules mentioned in bfavarettos answer.