Question

Possible Duplicate:
What is the explanation for these bizarre JavaScript behaviours mentioned in the 'Wat' talk for CodeMash 2012?

I know that when [] is coerced to a string it returns the empty string (""), and when {} is coerced to a string it returns "[object Object]".

When I run [] + {} in my browser’s Javascript console, it returns as I would expect:

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

But when I run {} + [], it returns a completely unexpected value:

>> {} + []
0

What could be causing it to return 0?

Answer 1

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.