首頁  >  文章  >  web前端  >  我們何時以及為什麼應該在 JavaScript 中將 async/await 與 .then() 結合?

我們何時以及為什麼應該在 JavaScript 中將 async/await 與 .then() 結合?

Mary-Kate Olsen
Mary-Kate Olsen原創
2024-11-03 11:45:291034瀏覽

When and Why Should We Combine async/await with .then() in JavaScript?

將Async/Await 和.then() 與Promise 轉換相結合

在JavaScript 中,async/await 是處理非同步操作的強大機制。然而,在某些情況下,將 async/await 與 .then() 結合起來可能會很方便,特別是在將 Promise 轉換為非​​同步函數時。

考慮以下範例:

<code class="javascript">async apiCall(params) {
    var results = await this.anotherCall()
      .then(results => {
        //do any results transformations
        return results;
      })
      .catch(error => {
        //handle any errors here
      });
    return results;
  }</code>

這裡, anotherCall() 方法傳回一個 Promise,使用 .then().catch() 將其轉換為非同步函數。這使我們能夠在返回結果之前執行任何必要的轉換或錯誤處理。

有些開發人員喜歡將 async/await 與 .catch() 一起使用,而不是使用 try/catch ,因為它的緊湊性。例如:

<code class="javascript">async function asyncTask() {
  throw new Error('network')
}
async function main() {
  const result = await asyncTask().catch(error => console.error(error));
  console.log('result:', result)
}

main();</code>

在此範例中,asyncTask() 函數拋出錯誤,該錯誤由await 呼叫中的.catch() 方法捕獲。這可以防止錯誤傳播,並允許我們在 main() 函數中優雅地處理它。

需要注意的是,.then() 方法創建並傳回一個新的 Promise,即使返回了原始的 Promise透過 anotherCall() 已經解決了。這種行為可能會導致意想不到的副作用,特別是如果使用 .then() 將多個 Promise 連結在一起。

以上是我們何時以及為什麼應該在 JavaScript 中將 async/await 與 .then() 結合?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn