ES2016 是最新的 JavaScript 版本，其中包含了许多新特性，并且逐渐成为了前端开发标准。然而，由于各个浏览器对 ES2016 的支持程度不同，这给前端开发带来了一定的挑战。
这时候，Babel 就派上了用场。Babel 是一个 JavaScript 编译器，可以将 ES2016 的语法转换成 ES5 的语法，使得浏览器可以正常解析执行代码。
在使用 Babel 的时候，需要指定 Babel 的预设选项，这样才能正确地进行语法转换，这里介绍一个常用的预设选项，即 babel-preset-es2016。
安装 babel-preset-es2016
首先需要使用 npm 安装 babel-preset-es2016：
npm install --save-dev babel-preset-es2016
配置 babel-preset-es2016
在配置 Babel 的时候，需要使用 .babelrc 这个配置文件来指定预设选项。我们可以在项目的根目录下新建一个文件 .babelrc，然后在其中添加配置：
{
"presets": ["es2016"]
}这里 "es2016" 是预设的名称，它会告诉 Babel 该如何进行语法转换。通常，在 .babelrc 文件中还会加上其他的预设选项，比如 babel-preset-react（用于 React 开发）等。
使用 babel-preset-es2016 进行语法转换
当配置完 babel-preset-es2016 后，我们就可以使用它来进行语法转换了。有两种方式可以使用 babel-preset-es2016：命令行和 JavaScript 代码。
命令行方式
如果我们只需要转换一个文件，可以使用 babel-cli 工具。我们首先需要全局安装这个工具：
npm install -g babel-cli
然后，在命令行中运行：
babel input.js --presets es2016 --out-file output.js
其中，input.js 是要被转换的文件，output.js 是转换后输出的文件。通过这种方式，我们可以在命令行中直接进行语法转换。
JavaScript 代码方式
如果我们需要在 JavaScript 代码中进行语法转换，可以使用 babel-core 包。我们需要先安装这个包：
npm install --save-dev babel-core
然后，在 JavaScript 代码中编写以下代码：
-- -------------------- ---- ------- ----- ----- - ---------------------- ----- ----- - - ----- - - ----- -- -- ----- ------------------- -- ----- ------ - ---------------------- - -------- ---------- --- -------------------------
这个代码会将 input 字符串中的 ES2016 语法转换成 ES5 语法，并将结果打印到控制台中。
总结
通过本文的讲解，我们了解了 npm 包 babel-preset-es2016 的使用方法，以及如何在命令行和 JavaScript 代码中使用它进行语法转换。当我们需要使用 ES2016 的语法时，可以使用 babel-preset-es2016 转换成 ES5，并且可以在所有浏览器中正常执行。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/125274