javascript - 函数表达式到底发生了什么？

Question

我在 freecodecamp 上学习了 javascript 的基础知识只是为了刷新我的内存，当我到达 ES6 和解释 var 和 let 之间的区别时，其中一个例子给了我(和我的同事)头疼。

'use strict';
let printNumTwo;
for (let i = 0; i < 3; i++) {
    if (i === 2) {
        printNumTwo = function() {
            return i;
        };
    }
}

console.log(printNumTwo());
// returns 2

console.log(i);
// returns "i is not defined"

我期待 printNumTwo 函数返回 undefined，认为在它被调用时变量 i 不存在。我的一位同事说，当函数表达式被分配给变量时，i 的值是 2 所以当你调用函数时它总是返回 2。

为了检验这一理论，我们将原始示例修改为:

'use strict';
let printNumTwo;
for (let i = 0; i < 3; i++) {
    if (i === 2) {
        printNumTwo = function() {
            return i;
        };
        
        i++;
    }
}

console.log(printNumTwo());
// returns 3

console.log(i);
// returns "i is not defined"

令所有人惊讶的是，在 for 循环返回 3 而不是 2 或最初预期的 undefined 之后调用该函数。

谁能解释一下为什么会出现这种行为？当您将函数表达式分配给变量或调用此类变量时，究竟会发生什么？

Answer 1

您正在制作和使用 closures .闭包是一个函数，加上声明它的环境。当你写这行代码时:

printNumTwo = function() {
  return i;
};

该函数引用了 i 变量。只要这个函数存在，那个变量就不会被垃圾回收，并且可以继续被这个函数引用。它不是保存值的快照，而是保存对实际变量的引用。如果该变量发生变化，如您的第二个示例，则引用会看到该修改后的值。