Promise 是 JavaScript 中一种用于处理异步操作的对象。在原生的 JavaScript 中，我们可以使用 Promise 对象来解决回调地狱等问题。但是不同浏览器中的 Promise 实现会有一些不同之处，这会给我们的跨浏览器开发带来一些不必要的麻烦。本文将介绍利用 ECMAScript 2018 新特性实现跨浏览器的 Promise 的方法。
ECMAScript 2018 更新
ECMAScript 2018，也被称为 ES2018，是 JavaScript 语言标准的最新版本。它引入了一些新特性，其中最有用的是异步函数的诞生。异步函数会返回一个 Promise 实例，使异步代码的编写比原生 Promise 更加方便。下面是一个异步函数的示例：
async function getUserInfo() {
const response = await fetch('/api/userinfo');
return await response.json();
}这个函数使用了新的关键字 async 和 await。async 可以修饰一个函数，使这个函数返回一个 Promise 对象。await 可以让代码等待一个异步操作完成后再继续执行。在这个示例中，我们使用 async 和 await 来请求一个用户信息的 JSON。
利用 async 和 await 实现更加易用的 Promise
我们可以使用 async 和 await 关键字来在支持 ECMAScript 2018 的浏览器中写出更加简洁易懂的 Promise 代码。以下是一个例子：
-- -------------------- ---- -------
----- -------- ---------------------- -
----- -------- - ----- -----------
----- ---- - ----- ----------------
------ -----
-
-- --------------- -
------------ - ------------- -
------ -----------------------
--
-这个示例中，我们定义了一个 fetchWithPolyfill 函数，并将其返回值设为一个 Promise 对象。在不支持原生 fetch 的浏览器上，我们可以将 window.fetch 重新定义为返回使用 polyfill 实现的 fetchWithPolyfill 函数。在支持原生 fetch 的浏览器中，我们可以直接使用原生的 fetch 函数。
提高 Promise 的可靠性
使用 Promise 的一个常见问题是：如果在处理 Promise 的过程中，发生了一个异常，它会导致 Promise 被拒绝，进而中断整个程序的执行。为了提高 Promise 的可靠性，我们可以使用 Promise 的 catch 方法，让 Promise 在发生异常时，继续执行。
-- -------------------- ---- -------
-------- ------------- -
------ ----------------------
-------------- -- -
-- ---------------- --- ---- -
------ ----------------
- ---- -
----- ------------------- ------------------------
-
--
------------ -- -
---------------------- -------- -------
------ ---
---
-在这个示例中，我们使用了 catch 方法监控 Promise 的异常情况，并在出现异常时，打印错误信息并返回一个空对象。
结论
通过使用 ECMAScript 2018 的新特性，我们可以更加方便地编写应用程序中的异步操作，并且更容易在浏览器间复用代码。使用 async 和 await 关键字可以大幅减少代码量并提高可读性。如果我们需要在不支持原生 Promise 的浏览器上使用 Promise，我们可以使用相关的 polyfill。最后，为了提高 Promise 的可靠性，我们可以使用 catch 方法以捕获和处理异常。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/671a24ca9babaf620fa19215