被Babel误解的JS代码

时间:2017-01-02 10:20:21

标签: javascript ecmascript-6 babeljs

以下代码

是如此严重错误
var obj = {a:1}
[1,2,3].forEach(console.log)
巴贝尔产生这种故障混合物?

var obj = { a: 1 }[(1, 2, 3)].forEach(console.log);

任何ES201 [567]预设。已通过https://babeljs.io/repl验证。

是的,用分号终止第一行有帮助。不使用分号仍然是一种危险的做法吗?

更新:在以#34; gosh为理由进行downvoting之前,你当然应该使用分号",请确认的演变使用它们,以及箭头功能和不断增长的数组/对象原型功能的玩具箱。所有现代JS的例子都是这样做的,ES6新手容易混淆。

1 个答案:

答案 0 :(得分:1)

Babel编译的代码中没有提到这个问题:你给它的两行被解释为一行。

  

不使用分号仍然是一种危险的做法吗?

在我看来,没有。 JavaScript中的空格被折叠意味着多行可以被解释为一行,因此有一些情况需要它们,但这是否意味着使用分号是绝对必须的,这实际上取决于个人偏好。有些人非常强烈地认为你应该,他们可能是对的...

无论如何,正如您所发现的,其中一种情况是以对象或数组结束一行,并以数组文字([])开始下一行。您可以阅读其余案例here

如果您正在处理的代码不使用分号,例如,如果它使用standard代码样式,您可以..

..在第一行的末尾添加一个分号:

var obj = {a:1};
[1,2,3].forEach(console.log)

..在第二行的开头添加一个分号:

var obj = {a:1}
;[1,2,3].forEach(console.log) // beginning of last line

..通过将数组文字指定给变量来避免使用分号:

var obj = {a:1}
var arr = [1,2,3]
arr.forEach(console.log)

____

旁注......

数组文字的内容用括号括起来的原因是因为Babel将您的数组文字解释为尝试访问上一行中定义的对象文字的属性。当然,您只能使用array[index]语法一次访问一个属性,因此Babel使用逗号运算符从(1, 2, 3)中获取单个值,该值为3

Read about the comma operator on MDN