javascript - 在 ES6 之前的代码中使用 "let"和 "const"可以吗？

Question

我正在(重新)学习 Javascript，有人建议我避免混合使用 ES5 和 ES6 类型的代码。但是我的 IDE Webstorm 一直警告我应该在我的代码中使用 let 和 const -- 有大量的黄色标记。当然，我可以关闭这些警告，但我是否应该始终在适当的时候使用 let 和 const，即使我的其余代码目前“过时了”学校”javascript？ (顺便说一句，我欢迎任何关于过渡到 ES6 的最佳实践的链接/建议，即开始将 ES6 引入代码的最佳方式)。谢谢!

Answer 1

您问题的基本答案:不，在真正的 ES5 中使用 let 和 const 是不行的。您需要使用 var。补充一点:如果 Webstorm 抛出这些警告但你正在编写 ES5 那么你的设置是错误的。转到设置 > 语言和框架 > Javascript，并将你的 Javascript 语言版本更改为 ECMAScript 5.1。如果您知道您正在编写 ES5，那么您不应该将其设置为根据 ES6 规范验证您的代码。

这里有一些额外的信息:

最近我一直在努力连接一个转译器 ( Babel ) 以在生产环境中将所有 Javascript 转换为 ES5 兼容语法。如果你想使用 ES6 语法，但仍然需要支持非 ES6 兼容的浏览器(例如 IE9 - IE11)，那么像 Babel 这样的转译器是必要的。考虑到这一点，我想提出一些与 let 和 const 相关的具体说明。

在真正的 ES6 中使用 let 来定义一个变量，在它的 block 范围内创建它。这意味着一旦 block 退出，命名变量就会被丢弃。正因为如此，类似下面的事情是可能的:

const x = 'I am a constant';
if (1 == 1) {
  let x = 'Not here for long';
  console.log(x); // => 'Not here for long'
}
console.log(x); // => 'I am a constant';

当使用 let 创建 block 作用域的 x 实例时，它优先于此 block 内的 const x (我们的 if 语句这个案例)。为了兼容 ES5 浏览器，Babel 把它变成了什么其实很聪明:

var x = 'I am a constant';
if (1 == 1) {
  var _x = 'Not here for long';
  console.log(_x); // => 'Not here for long'
}
console.log(x); // => 'I am a constant';

正如您在此处看到的，它实际上创建了一个具有不同名称 _x 的新 var，因此它不会与原始 x 冲突。

最后一点:如果您使用的是 Promise 和 Symbol 等新功能，那么转译器是不够的。您还需要为这些使用 polyfill。