JAVASCRIPT编入集

十、{ } 、 ( )有话说

2018-01-03  本文已影响25人  loster
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的源文件解释为可以执行的语法树,标注每一个语句的具体内容

上一篇下一篇

猜你喜欢

热点阅读