For loop let scope stackblitz vs chrome dev tools

Posted 2023-02-22

【中文标题】For loop let scope stackblitz vs chrome dev tools

【英文标题】：

【发布时间】：2019-03-09 06:14:38

【问题描述】：

为什么以下代码在 StackBlitz 与 Chrome 开发工具中产生不同的结果？

我希望i 在for 循环之外是undefined（同意Chrome 开发工具的结果）。

Stackblitz 的结果是怎么回事？

---

Stackblitz（空白 ES6 项目）

---

Chrome 开发工具

【问题讨论】：

听起来像是 Stackblitz 的一个问题......他们可能会转换为 ES5 并将 let 替换为 var，这将提升变量。

【参考方案1】：

StackBlitz 将代码转换为 ES5，从而将 let 更改为 var。后者是函数范围的，因此它在循环之外是可见的。

【讨论】：

谢谢。当您访问 StackBlitz 的网站并单击新的 javascript 项目时，描述中指出：“用于构建 ES6 应用程序的空白启动项目。”

当然，那是因为你写的是 ES6。转译过程是一个实现细节。

【参考方案2】：

在 Chrome 中，您在浏览器中运行本机 ES6，Stackblitz 是 Babel 将 ES6 编译为 ES5，因此 let 将成为 var。 var 变量在整个块中都有作用域。

【讨论】：

谢谢。当您访问 StackBlitz 的网站并单击新的 JavaScript 项目时，描述中指出：“用于构建 ES6 应用程序的空白启动项目。”

构建 ES6 应用程序并不意味着它们不能被编译到 ES5 以在原生不支持 ES6 的浏览器中运行。

我不反对。只是说他们可以更清楚地说明这一点。

你应该在 for 块之外引用 i 时遇到编译器错误。

是的，我应该有。但我没有。