es6解构赋值 [a,b] = [b,a]的几个问题

相比于传统方法须要一个额外变量来进行值交换，使用解构进行值交换十分方便。可是我想到几个问题：

一、解构赋值有没有节省空间呢？

// 传统

let c = b;

b = a;

a = c;

// 解构

[a, b] = [b, a];
复制代码

首先思考以下操做：

let a = 1, b = 2;

[a, b] = [b=a, a=3];//1 3
复制代码

能够分析出解构赋值的过程应当为

1. 以从左到右的顺序计算右侧数组的值，获得数组
2. 以从左到右的顺序，将右侧数组的值赋给左侧

能够看到解构复制的过程当中会有一个包含两个元素的临时数组，并无比传统方法节省空间，甚至空间会比传统方法更多一个int值大小的空间。

二、解构赋值有没有更快呢？

话很少讲，直接上代码：

const times = 3000000000;

let a = 1, b = 2;

let time1 = new Date().getTime();

while (i++ < times) {

  [a, b] = [b, a];

  let c = b;

  b = a;

  a = c;

  let d = b;

  b = a;

  a = d;

}

console.log(new Date().getTime() - time1); // 4300左右

time1 = new Date().getTime();

while (i-- >= 0) {

  [a, b] = [b, a];

  [a, b] = [b, a];

  let c = b;

  b = a;

  a = c;

}

console.log(new Date().getTime() - time1); // 6400左右
复制代码

能够看到，解构交换值的速度更慢。按照常理猜想一下，多是解构赋值须要申请临时数组，而后遍历数组对等号左侧的变量进行赋值，在此期间还须要检测数组元素是否为undefined，这一过程较为费时。

三、一个有趣（挠头）的发现

while (i++ < times) {

  [a, b] = [b, a];

  [a, b] = [b, a];

  let c = b;

  b = a;

  a = c;

}

while (i++ < times) {

  [a, b] = [b, a];

  [a, b] = [b, a];

}
复制代码

肉眼观察，上面的循环内操做更多，应当耗时更多，结果倒是在公司mbp上运行，前者耗时显著更少，在我的windows电脑上运行，两者耗时几乎一致。通过分析只知道可能与JIT有关，殊不知道具体缘由。但愿有大佬能够为萌新解惑呀～

欢迎关注「 字节前端 ByteFE 」

简历投递联系邮箱「tech@bytedance.com」