ES6 中 async/await 的使用及处理错误的方法

在现代前端开发中,异步编程是非常常见的。ES6 中引入了 async/await,提供了一种更加优雅的异步编程方式。本文将介绍 async/await 的使用方法以及如何处理错误。

async/await 的使用

async/await 是一种基于 Promise 的异步编程方式,它可以让我们用同步的方式来写异步代码。

async 函数

async 函数是一个返回 Promise 对象的异步函数,它的返回值会被自动包装成 Promise 对象。

----- -------- --------- -
  ------ -------
-

------------------- -- ------------------- -- ------

await 表达式

await 表达式用于等待一个 Promise 对象的状态变化,如果 Promise 对象变为 resolved 状态,则返回 Promise 对象的值;如果 Promise 对象变为 rejected 状态,则抛出错误。

----- -------- --------- -
  ----- ------ - ----- --------------------------------------
  ----- ---- - ----- --------------
  ------ -----
-

------------------- -- ------------------------------ -- ----------------------

在上面的例子中,我们使用 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