What is [] + [] in javascript

Question

What are the values of []+[], []+{}, {}+[], {}+{}? And How?

This my console log

>{} + {}
>NaN
>[] + []
>\'\'
>{} + []
>0
>[] + {         


        

Answer 1

The difference for the {} + [] is that when you do an assignment it is parsed in an expression context but when you type it by itself it is parsed as a statement

var b = /*an expression*/

This distinction is visible when using anonymous functions

//expression
var f = function(){}; //allowed

//statement
function(){}; //not allowed. function statements need a name.

---

So in the expression context, we add {} (empty object) and [] (empty list) with the binary + operator. Due to the type conversion rules, {} is converted to the string "[object Object]" and [] is converted to the empty string, the concatenation of which is "[object Object]" too.

//parenthesis force an expression 
({} + "hello")  //"[object Object]hello"
({} + [])       //"[object Object]"
({} + [1])      //"[object Object]1"
({} + [1,2])    //"[object Object]1,2"

Meanwhile, when we remove the parenthesis, the {} is parsed as an empty block statement. For pratical purposes it works as if we had commited it entirely, leaving an unary + operator to act on the list. This converts it to a number.

+[]     // 0
{} + [] // 0
+{}     // NaN
{} + {} // NaN
{} +"17"// 17

While it might seem weird to be able to get a value from a statement (instead of only from expressions), the Javascript standard, does specify a value for a statement. In our case, our program is a list of two source elements, whose value is given by the last statement, an expression statement.

A way to see the statement completion value in action is via eval:

 eval("{}")  //undefined
 eval("1")   //1
 eval("1;2") //2