Double let 声明：让提升如何在 for 循环中工作？

Question

鉴于以下简化代码，为什么会出现 ReferenceError？

    function foo(n){
        for (let i = 0; i < n; i++) {       
            console.log(i);
            let i = 10;
        }
    }

    foo(4);

// OUTPUT: ReferenceError: i is not defined

let 变量应该被提升为所有其他类型的声明。因此，在此代码中，i 被声明了两次。首先，在初始化关闭中，其次在 for 循环本身中。

为什么输出的是i is not defined而不是Identifier 'i' has already been declared。

JS如何读取上面的代码？

Answer 1

let 变量应该被提升为所有其他类型的声明。

let 变量没有提升，这与var 变量以及函数和类声明不同。 const变量是一样的。

在你到达声明它的行之前，该变量不会存在。

但是，在到达声明之前，您无法访问相关范围内的变量。这有点无益，被称为时间死区。 (Useful 2ality blog)

这很有帮助，因为在声明之前访问变量几乎总是错误的。或者，至少，它会令人困惑，并且会在您重构时导致错误。

function foo(n){
    for (let i = 0; i < n; i++) {       
        // i cannot be accessed
        let i = 10;
        // i is set to 10
    }
}

foo(4);

至于为什么不是“标识符已声明”错误，for 循环头中声明的变量的范围是与块中声明的变量分开的变量。这段代码中基本上有三个作用域：外层作用域，从for 循环头开始的作用域，以及从{} 包围的块开始的作用域。

Answer 2

下面发生的是 JavaScript 在同一个 for 循环中看到两个不同级别的块范围。

第一个在循环的初始化子句中声明 (let i = 0;)，第二个在循环本身内。

这是您第一次运行代码时发生的情况：

• 初始化子句中的let：i = 0;
• let inside for 循环：i is set to undefined

当 for 循环命中 console.log(i) 时，它会在循环内找到 let i 的声明，该声明覆盖先前声明和分配的 let i（在初始化子句中。

由于每次提升，let 和 const 已声明但未初始化（如 undefined），它会引发 ReferenceError。

Answer 3

根据MDN：

function test(){
  var foo = 33;
  if (true) {
   let foo = (foo + 55); // ReferenceError
  }
}
test();

由于词法作用域，表达式 (foo + 55) 中的标识符“foo”计算为 if 块的 foo，而不是值为 33 的上层变量 foo。 在那一行中，if 块的“foo”已经在词法环境中创建，但还没有达到（并终止）它的初始化（这是语句本身的一部分）：它仍然在时间死区。

这意味着如果循环变量在您的示例中为“读取”，（在您的情况下为 console.log，您不能将其分配给同名 var，因为它在“死区”中

MDN 参考：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let（在时间死区下）