Why does {} + [] return 0 in Javascript? [duplicate]

Answer 1

Because the {} is treated as a block. Thus your statement is actually:

{

//empty block here
}

+[] //0 same as Number([])

This is why this is invalid javascript:

eval('{hello: "world", key: "value"}') //Syntax error

You can add () to make it an expression (blocks cannot be used in an expression so it will be object initializer:

eval('({hello: "world", key: "value"})') //Object

Answer 2

The empty block gets coerced into a zero. Then the + operator decides to coerce the [] to a number.

Answer 3

When there is a { at the beginning of a statement, it will be interpreted as a block, which may contain zero or more statements. An block with no statements in it will have an empty continuation value.

In other words, in this case, {} is interpreted as an empty code block.

The statement ends after the ending brace }, which means that the next three characters +[] comprise a statement of their own.

At the beginning of an expression or statement, + is the unary plus operator, which coerces its operand to a number.

So +[] is the same as Number([]), which evaluates to 0.

In short, {} + [] is an empty code block followed by an array coerced to a number.

---

All that said, if you evaluate {} + [] inside an expression, it will return what you expect:

>> ({} + []) 
"[object Object]" 

Another interesting thing is that you cannot begin a statement with an object literal because the interpreter will try to parse it as a statement. Doing this

{ "object": "literal" };

will throw a syntax error.