理解 Babel 转译的 ES6 到 ES5 代码答案

【问题标题】：Understanding ES6 to ES5 code as transpiled by Babel理解 Babel 转译的 ES6 到 ES5 代码
【发布时间】：2015-12-28 04:12:33
【问题描述】：

Babel 转译以下 ES6 代码

test(){
    var list = [ 1, 2, 3 ]
    var [ a, , b ] = list
    [ b, a ] = [ a, b ]
  }

进入这个

function test() {
      var list = [1, 2, 3];

      var _list = list[(b, a)] = [a, b];

      var _list2 = _slicedToArray(_list, 3);

      var a = _list2[0];
      var b = _list2[2];
    }

我不明白这行代码到底发生了什么

var _list = list[(b, a)] = [a, b];

具体来说，我对 list[(b, a)] 一无所知。非常感谢任何帮助？

【问题讨论】：

我敢打赌，如果你在 JavaScript 控制台中玩过一点，你就会明白的。
我通过评估类似 (1,2,10,9) 的值在控制台中做了一些实验，发现返回的值始终是最后一个表达式的值。我这样做是为了知道 (a,b) 在 list[(b,a)] 中的计算结果。但我对逗号运算符是什么以及它是如何工作的一无所知。在不知道它在语言中的名称的情况下，我无法验证我的发现。还有@loganfsmyth 解释的半冒号插入部分可能永远不会打动我。

标签： ecmascript-6 babeljs

【解决方案1】：

简短的回答是

var [ a, , b ] = list
[ b, a ] = [ a, b ]

与

相同

var [ a, , b ] = list[ b, a ] = [ a, b ]

因为自动分号插入不适用于这种情况。同样的情况也适用于这个 ES5 示例：

var list = [1, 2, 3]
var value = list
[1]
console.log(value);

如果您运行此代码，它将记录2，而不是[1, 2, 3]，因为索引应用于上一行，而不是在下一行被视为数组。

自动分号插入通常适用于解析器遇到语法错误，后退一步，并在插入分号后尝试的情况。

在这两种情况下，下一行的内容作为上一行的一部分是完全有效的，因此它被视为没有自动分号。

在您的示例中，list[a, b] 被解析为使用逗号运算符操作的结果访问索引，该结果本质上将评估为list[b]。逗号运算符一次处理一个表达式列表，然后最终计算出最后一个表达式的结果。

【讨论】：