await 錯誤捕獲實現方式原始碼示例解析

大雄45發表於2023-02-25
導讀 這篇文章主要為大家介紹了await 錯誤捕獲實現方式原始碼示例解析,有需要的朋友可以借鑑參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪
前言

Promise 是一種在 JavaScript 中用於處理非同步操作的機制。Promise 在開發中被廣泛使用,這篇文章將學習如何優雅的捕獲 await 的錯誤。

資源:

倉庫地址:await-to-js

參考文章:How to write async await without try-catch blocks in Javascript (grossman.io)

Promise 的使用方法
  • 建立一個 Promise 例項。這通常是透過呼叫 Promise 建構函式來完成的,並將一個函式作為引數傳遞給建構函式,該函式接收兩個引數:resolve 和 reject。resolve 和 reject 分別用於處理 Promise 的成功和失敗結果。
  • 在函式體內執行非同步操作。當非同步操作完成時,如果執行成功,則呼叫 resolve 函式來將 Promise 的狀態變為“已完成”,並將結果作為引數傳遞給 resolve 函式;如果執行失敗,則呼叫 reject 函式將 Promise 的狀態變為“已拒絕”,並將失敗的原因作為引數傳遞給 reject 函式。
  • 使用 then 方法來處理 Promise 的成功和失敗結果。then 方法接收兩個引數:一個處理成功結果的函式和一個處理失敗結果的函式。在 Promise 狀態變為“已完成”或“已拒絕”後,then 方法會自動執行相應的處理函式。
  • 示例程式碼如下:

const myPromise = new Promise(function(resolve, reject) {
  // 執行非同步操作
  setTimeout(function() {
    // 非同步操作成功
    resolve('Success');
  }, 1000);
});
// 處理 Promise 的成功和失敗結果
myPromise.then(function(result) {
  // 處理成功結果
  console.log(result);
}).catch(function(err){
  // 處理失敗
  console.log(err)
})

非同步函式正在等待 Promise,因此當 promise 遇到錯誤時,它會丟擲一個異常,該異常將在 promise 的 catch 方法中捕獲。

其他處理錯誤的方式:

try{
    const res = await myPromise()
}catch(e){
    console.log(e)
}

當程式碼中有大量的非同步操作時,就需要有很多的try/catch 塊,程式碼看起來就很臃腫,那麼有什麼更好的處理這些錯誤的辦法呢?

await-to-js

這個專案的 slogan 是:

Async await wrapper for easy error handling

非同步等待包裝,方便錯誤處理

用法:

import to from 'await-to-js';
[ err, user ] = await to(UserModel.findById(1));
if(!user) return cb('No user found');

to 函式接收一個 Promise,然後將成功響應解析為陣列,並將返回資料作為第二項。從捕獲中收到的錯誤作為第二項。

原始碼
/**
 * @param { Promise } promise
 * @param { Object= } errorExt - Additional Information you can pass to the err object
 * @return { Promise }
 */
export function to(
  promise: Promise,
  errorExt?: object
): Promise<[U, undefined] | [null, T]> {
  return promise
    .then<[null, T]>((data: T) => [null, data])
    .catch<[U, undefined]>((err: U) => {
      if (errorExt) {
        const parsedError = Object.assign({}, err, errorExt);
        return [parsedError, undefined];
      }
      return [err, undefined];
    });
}
export default to;

接收一個 Promise 例項和一個可選的 errorExt 物件作為引數。該函式返回一個新的 Promise。

原理是使用 then 方法處理 Promise 的成功結果,並使用 catch 方法處理 Promise 的失敗結果。如果 Promise 執行成功,則會將結果包裝成一個包含兩個元素的陣列並作為新的 Promise 的成功結果返回;如果 Promise 執行失敗,則會將錯誤物件包裝成一個包含兩個元素的陣列並作為新的 Promise 的失敗結果返回。

使用await-to-js,得以一行程式碼完成對非同步程式碼錯誤的捕獲,閱讀文章得知,await-to-js 是作者透過goLang啟發得來的靈感。更加說明瞭融會貫通,學以致用的重要性。

原文來自:


來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/69955379/viewspace-2933013/,如需轉載,請註明出處,否則將追究法律責任。

相關文章