十、{ } 、 ( )有话说

javascript编入集

昨天在群里，激烈的讨论着一个很简单的问题 ( {}+[] ) 输出什么。其实，只要明白这里 + 是干什么的就很容易知道这个是干什么的实际上就是两个对象的“加法”

( {}+[] ) // 等价于
({}.toString() + [].toString())

但是为什么会有一个 ( ) 包裹起来呢，还是说为什么这里{ }在前就需要用到它。
在这之前，需要说一下 { }
{ } 它本身代表的含义是 object对象的字面量。但是同时他又代表的是函数体或者复合语句块（block）。比如

function some ()
{  }
// or
if()
{   }
while()
{   }
// or
{  }

虽然换行了，但是这样写是没有错的。
并且来说，如果单独的 { } 是作为语句块来执行的，内部内容等效于 eval 看（block）NOTE 部分

{ var a =1 } //
eval("var a = 1")

但是如果只单独写：

{  } + [ ]

如果只写了一个这个的话，左边就不能严格的区分是对象
实际上这句话在解释的时候被解释为了两句：

{};
+[];

所以不管左侧的 {} 是什么内容，都不会被右侧的 + 所使用。

但是 加上( )之后，就不是了。
( ) 代表的是表达式。表达式内是不主动加;的^[1]，因此， ( {} + [] ) 就可以得到正确的运算结果了。
如果反过来，就不会出事：

[] + {}

那是因为 这里的[ ] 并不会被解释为其他行为，所以不会断句。就可以正确得到想要的结果了。

具体的执行流程需要看一下AST(Abstract Syntax Tree)^[2]，同时一款工具 esprima可以查看具体解析内容。

先知且为之，后知而食之

---

1. 添加;的行为只在语句的末尾添加，如果下一行可以与上一行连用，则不会加。因为js是会被压缩到一行的，解释器为了解释所以会主动进行断句。 ↩

2. 抽象语法树，将js的源文件解释为可以执行的语法树，标注每一个语句的具体内容 ↩