如何优雅处理async await错误推荐：await-to-js库

前端  /  管理员 发布于 2年前   484

优雅处理async await错误就用await-to-js库，因为await-to-js库无需try-catch 即可轻松处理错误的异步等待包装器。

库链接

https://www.npmjs.com/package/await-to-js

安装

npm i await-to-js --save
or
yarn add i await-to-js

为什么要使用await-to-js库？

async await虽然能处理promise 的回调地狱，但对错误的处理不够优雅和简洁，

如下面的代码：

function async asyncTask() {
    try {
      const asyncFuncARes = await asyncFuncA()
    } catch(error) {
      return new Error(error)
    }
    try {
      const asyncFuncBRes = await asyncFuncB(asyncFuncARes)
    } catch(error) {
      return new Error(error)
    }
    try {
      const asyncFuncCRes = await asyncFuncC(asyncFuncBRes)
    } catch(error) {
      return new Error(error)
    }
}

使用

import to from 'await-to-js'
function async asyncTask() {
   const [err, asyncFuncARes]  = await to(asyncFuncA())
   if(err) throw new (error);
   
   const [err, asyncFuncBRes]  = await tp(asyncFuncB(asyncFuncARes))
   if(err) throw new (error);
   
   const [err, asyncFuncCRes]  = await to(asyncFuncC(asyncFuncBRes)
   if(err) throw new (error);
}

源码

function to(promise, errorExt) {
    return promise
        .then(function (data) { return [null, data]; })
        .catch(function (err) {
        if (errorExt) {
            Object.assign(err, errorExt);
        }
        return [err, undefined];
    });
}
export { to };
export default to;