javascript - 当 Babel 和 Traceur 转译 ES6 解构时，额外变量的目的是什么？

Question

Babel 和 Traceur 都会转换为以下代码

obj = {
    fullName: "Peter",
    say() {
        console.log("My name is", this.fullName);
    }
};

let { fullName, say } = obj;

作为

"use strict";

obj = {
  fullName: "Peter",
  say: function say() {
    console.log("My name is", this.fullName);
  }
};
var _obj = obj,
    fullName = _obj.fullName,
    say = _obj.say;

(Traceur 使用名称 $__1 )引入新变量 _obj似乎完全没有必要。他们俩这样做的原因是什么？

Answer 1

当解构使用 var 声明的变量时可以重新分配包含您当前正在解构的值的变量。

var foo = { foo: 1, bar: 2 };
var {foo, bar} = foo;
console.log(`foo: ${foo}, bar: ${bar}`);
// outputs "foo: 1, bar: 2"

如果这是在没有创建临时变量的情况下天真地转译，则变量 foo 将在检索 bar 的值之前被更改:

var foo = { foo: 1, bar: 2 };
var foo = foo.foo;
var bar = foo.bar;
console.log(`foo: ${foo}, bar: ${bar}`);
// outputs "foo: 1, bar: undefined"

我的猜测是 Babel 有一个优化，它认为 let 没有必要这样做。绑定(bind)，因为那样你会在重新绑定(bind)同一个变量时出错。显然 Traceur 没有这种优化。我不确定为什么当解构变量实际上被重新绑定(bind)时，任何一个都不会只使用局部变量。