当 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 的值之前，变量 foo 将被更改：

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绑定是不必要的，因为那样在重新绑定同一变量时会出现错误。显然，Traceur没有这种优化。我不确定为什么当解构变量实际重新绑定时，任何一个都不只使用局部变量。