ES6:使用解构分配交换不直观的数组元素

时间:2019-01-28 23:01:52

标签: javascript node.js ecmascript-6

尝试通过使用destructuring assignment交换元素来对数组进行排序:

排序后的数组应为整数[1, 2, ...]的升序。

// try to sort the array by swapping 
const a = [2, 1];

下面的代码为什么不按预期交换元素?

// Swap the '2' with the number at its final position.
[a[0], a[a[0]-1]] = [a[a[0]-1], a[0]];
console.log(a); // Result is still [2, 1]

但是,切换要交换的元素的顺序可以正常工作。

// Just changed the order of the two elements to be swapped
[a[a[0]-1], a[0]] = [a[0], a[a[0]-1]];
console.log(a); // Result is [1, 2] as expected

Here's a nodejs REPL

1 个答案:

答案 0 :(得分:1)

似乎先缓存了=右边的值,然后按从左到右的顺序执行每个赋值。 如果后面的分配依赖于先前分配的值,则会导致不直观的结果

Babel将ES6代码编译为以下语句:

"use strict";

// try to sort the array by swapping elements
var a = [2, 1];

// does not work
var _ref = [a[a[0] - 1], a[0]];
a[0] = _ref[0];
a[a[0] - 1] = _ref[1];

console.log(a); // [2, 1]

第一个示例给出了一个不直观的结果,因为a [0]在作为第二个分配的一部分被访问之前已被修改。

交换分配顺序,以便在修改其值之前访问a [0]会产生正确的结果。

// does work
var _ref2 = [a[0], a[a[0] - 1]];
a[a[0] - 1] = _ref2[0];
a[0] = _ref2[1];

console.log(a); // [1, 2]