在现代 JavaScript 开发中，ES6 承诺（Promise）已成为异步编程的标准，但是不是所有浏览器都支持 Promise，这就需要我们通过编译的方式将 ES6 Promise 转化成 ES5 级别的代码，以保证代码在浏览器中的兼容性和稳定性。而 Babel 这个工具就是完成这项转化任务的最好的选择。在本文中，我们将详细介绍如何通过 Babel 编译 ES6 的 Promise。
1. 确保 Babel 安装完毕
如果你还没有安装 Babel，可以使用以下命令进行安装：
npm install -g babel-cli
安装完成后，你可以使用 “babel” 命令在命令行中调用 Babel。
2. 安装 Promise 转码插件
Babel 需要通过插件的方式去完成对 Promise 的转码工作。这个插件叫做 “babel-polyfill” ，可以通过以下命令进行安装：
npm install -S babel-polyfill
3. 引入 “babel-polyfill” 插件
在你的项目中，你需要在引入第一个 JS 文件之前打入以下代码，引入 “babel-polyfill” 插件：
import 'babel-polyfill';
4. 编写 ES6 Level 的代码
在你的项目中，你可以直接使用 ES6 Level 的 Promise 代码。如下所示：
-- -------------------- ---- -------
--- ------- - --- ----------------- ------- -- -
------------- -- -
---------- -- ---- ----
-- ------
---
------------------ -- -
-----------------
-------------- -- -
-------------------
---这段代码就是使用 ES6 Level 的 Promise 完成异步编程的示例。
5. 运行 Babel 完成编译
使用以下命令运行 Babel，将 ES6 Level 的 Promise 转化为 ES5 级别的代码：
babel <input_file> --out-file <output_file>
其中，<input_file> 为需要编译的原始代码文件路径，<output_file> 为编译后的 ES5 级别代码文件路径。例如：
babel es6-promise.js --out-file es5-promise.js
运行完成后，你将得到一份 ES5 级别的 Promise 代码。
6. 在浏览器中运行最终代码
在你的 HTML 文件中引用 ES5 级别的 Promise 代码，就可以在浏览器中运行最终的代码了：
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
---------- ------- ------------
-------
------
------- ------------------------------
--------
--- ------- - --- ----------------- ------- -- -
------------- -- -
---------- -- ---- ----
-- ------
---
------------------ -- -
-----------------
-------------- -- -
-------------------
---
---------
-------
-------结论
通过以上步骤，我们可以将 ES6 Level 的 Promise 代码编译成 ES5 级别的代码，以保证代码的兼容性和稳定性，同时使用 ES6 Level 的 Promise 代码编写异步编程可以更加简单、直观、易于维护和扩展。
为了让代码更加简便易读，建议使用 Promise 的链式调用以及异步函数等语言特性，以达到代码简洁、结构清晰、易于理解和维护的效果。
示例代码
ES6 Promise 示例代码：
-- -------------------- ---- -------
--- ------- - --- ----------------- ------- -- -
------------- -- -
---------- -- ---- ----
-- ------
---
------------------ -- -
-----------------
-------------- -- -
-------------------
---ES5 Promise 编译后的代码：
-- -------------------- ---- -------
---- --------
--------------------------
--- -------- - -----------------------------------------
--- --------- - ---------------------------------
-------- --------------------------- - ------ --- -- -------------- - --- - - -------- --- -- -
--- ------- - --- -------------------------- --------- ------- -
------------------- -- -
---------- -- ---- ----
-- ------
---
--------------------- ----- -
-----------------
----------------- ----- -
-------------------
---来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67165413ad1e889fe21c0a67