闭包如何与 js 中的 let 一起使用？答案

【问题标题】：how is closure working with let in js?闭包如何与 js 中的 let 一起使用？
【发布时间】：2017-05-18 12:41:36
【问题描述】：

我正在了解 ES6 中的新功能。我对 let 的实际行为有疑问，让我们检查以下示例：

function aHero() {
  return 'Boy'
}

function aFoil() {
  return 'Rat'
}

function aDeed() {
  return 'Deed'
}

let sagas = [];
let hero = aHero();
let newSaga = function () {
  let foil = aFoil();
  sagas.push(function () {
    let deed = aDeed();
    console.log(hero + deed + foil)
  });
}

newSaga();
sagas[0]();
sagas[0]();
newSaga();

ES5：var 作用域变量到整个函数，所以当代码在浏览器中运行时，所有变量都被提升，另一方面在 ES6 let 作用域变量到它的块，所以当运行此代码saga[0]() 将打印三个单词'BoyDeedRat'

所以我想知道闭包是如何与 let 一起工作的？？

【问题讨论】：

不清楚您在这里问的是什么 - 无论您在这些地方使用 let 还是 var（或 const），这段代码都会产生相同的结果。
@JamesThorpe 是的，但是使用 var 是正常的，我想知道为什么它使用 let？
@HazemHagrass 为什么不能与let 一起使用？所有变量的作用域都是函数——这里没有额外的块。
@JamesThorpe 问题是调用发生在作用域之外，这个箔函数只是被推送到数组但在瓢之外调用
@HazemHagrass 是的，那是how closures work - 该函数在它被声明的newSaga 的范围内关闭。但无论foil 是用let 还是var 在那个范围内。

标签： javascript ecmascript-6 closures

【解决方案1】：

我相信在 javaScript 中，如果 function 关键字被使用另一个函数并被返回，解释器会理解你正在创建一个闭包。在大多数其他常见语言中，函数返回后，所有局部变量都不再可访问，因为上下文已被破坏，但是在 JavaScript 中，如果函数在另一个函数中声明，则所有局部变量在从函数返回后仍然可以访问你打过电话了。简而言之，内部函数将在其父范围内运行，并且可以访问所有父变量和函数。详细信息请查看this链接。

【讨论】：

【解决方案2】：

在 Chrome、Safari 和 Firefox 中，let 变量是块的本地变量，即使在循环中也是如此。

两者

(function(){
    let fns = [];
    for (let i = 0; i < 5; i++) {
        fns.push(() => { console.log(i); });
    }
    for (let i = 0; i < fns.length; i++) {
        fns[i]();
    }
})();

和

(function(){
    let fns = [];
    for (var i = 0; i < 5; i++) {
        let num = i; // closure will refer to separate values per iteration
        fns.push(() => { console.log(num); });
    }
    for (let i = 0; i < fns.length; i++) {
        fns[i]();
    }
})();

打印

而在任何一种情况下使用var 而不是let 都会打印4 五次。

【讨论】：