为什么 ES6 代码和 ES5 代码经过 Babel.js 编译后的结果不同？

Question

ES6 代码：

let foo = 'outer';

function bar(func = x => foo){
    let foo = 'inner';
    console.log(func());
}
bar(); // outer

结果是“外部”。

Babel.js 编译的 ES5 代码：

'use strict';

var foo = 'outer';

function bar() {
    var func = arguments.length <= 0 || arguments[0] === undefined ? function (x) {
        return foo;
    } : arguments[0];

    var foo = 'inner';
    console.log(func());
}
bar(); // inner

结果是“外部”。

我不知道为什么他们有不同的结果。

Answer 1

这是一个bug in Babel。复杂参数列表中的表达式应该看不到函数体中的声明，但是这里 Babel 生成的代码会计算函数范围内的默认参数，其中内部的foo 是可见的。