在现代前端开发中，异步编程是非常常见的。ES6 中引入了 async/await，提供了一种更加优雅的异步编程方式。本文将介绍 async/await 的使用方法以及如何处理错误。
async/await 的使用
async/await 是一种基于 Promise 的异步编程方式，它可以让我们用同步的方式来写异步代码。
async 函数
async 函数是一个返回 Promise 对象的异步函数，它的返回值会被自动包装成 Promise 对象。
async function getData() {
return 'data';
}
getData().then(data => console.log(data)); // 'data'await 表达式
await 表达式用于等待一个 Promise 对象的状态变化，如果 Promise 对象变为 resolved 状态，则返回 Promise 对象的值；如果 Promise 对象变为 rejected 状态，则抛出错误。
async function getData() {
const result = await fetch('https://api.example.com/data');
const data = await result.json();
return data;
}
getData().then(data => console.log(data)).catch(error => console.error(error));在上面的例子中，我们使用 await 表达式等待 fetch 方法返回的 Promise 对象。如果 fetch 方法返回的 Promise 对象变为 resolved 状态，则我们可以继续使用 await 表达式等待 result.json() 方法返回的 Promise 对象。
错误处理
在使用 async/await 时，我们可以使用 try/catch 语句来捕获错误。
-- -------------------- ---- -------
----- -------- --------- -
--- -
----- ------ - ----- --------------------------------------
----- ---- - ----- --------------
------ -----
- ----- ------- -
---------------------
-
-在上面的例子中，如果 fetch 方法返回的 Promise 对象变为 rejected 状态，则 await 表达式会抛出错误，被 try/catch 语句捕获。
处理错误的方法
在实际开发中，我们需要对错误进行更加细致的处理。下面是几种常见的处理错误的方法。
返回默认值
如果 Promise 对象变为 rejected 状态，我们可以返回一个默认值。
-- -------------------- ---- -------
----- -------- --------- -
--- -
----- ------ - ----- --------------------------------------
----- ---- - ----- --------------
------ -----
- ----- ------- -
---------------------
------ ---
-
-在上面的例子中，如果 fetch 方法返回的 Promise 对象变为 rejected 状态，则我们返回一个空数组作为默认值。
抛出错误
如果 Promise 对象变为 rejected 状态，我们可以抛出一个错误。
-- -------------------- ---- -------
----- -------- --------- -
--- -
----- ------ - ----- --------------------------------------
----- ---- - ----- --------------
-- ------- -
----- --- --------- -------
-
------ -----
- ----- ------- -
---------------------
----- ------
-
-在上面的例子中，如果 fetch 方法返回的 Promise 对象变为 rejected 状态或者返回的数据为空，则我们抛出一个错误。
重试
如果 Promise 对象变为 rejected 状态，我们可以重试请求。
-- -------------------- ---- -------
----- -------- --------- -
--- ---------- - --
----- ----------- - -- -
--- -
----- ------ - ----- --------------------------------------
----- ---- - ----- --------------
------ -----
- ----- ------- -
---------------------
-------------
-
-
----- --- ---------- ----- ----- -----------
-在上面的例子中，我们最多重试 3 次请求，如果请求失败 3 次，则抛出一个错误。
总结
async/await 是一种优雅的异步编程方式，它可以让我们用同步的方式来写异步代码。在使用 async/await 时，我们需要注意错误处理，可以返回默认值、抛出错误或者重试请求。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65cd86bbadd4f0e0ff6bfe3e