前言
日常开发中相信大家或多或少会使用异步函数，那么异步函数应该如何优雅地捕获错误呢？如果跟我一样只会 try catch 的话就一起来学习一下 await-to-js 的用法跟源码吧！源码加上注释才22行！
收获清单
- 优雅地捕获await 的错误
- 调试源码
await-to-js应用
简介
官方简介如下，大意就是异步等待包装器，方便错误处理
使用
老规矩，使用方法看 readme。这时候可能有人会说了，我用着try catch好好的，为啥还要引入个库来捕捉错误，选它的理由是啥？正所谓没有对比就没有伤害，咱们来对比一下两者的使用
try-catch捕捉错误
const getData = async ()=>{
try {
const data1 = await fn1()
} catch (error) {
console.log(error)
}
try {
const data2 = await fn2()
} catch (error) {
console.log(error)
}
try {
const data3 = await fn3()
} catch (error) {
console.log(error)
}
}
复制代码await-to-js捕获错误
import to from 'await-to-js';
const awaitGetData = async()=>{
const [err1,data1] = to(Promise)
if(err1) throw new (error);
const [err2,data2] = to(Promise)
if(err2) throw new (error);
const [err3,data3] = to(Promise)
if(err3) throw new (error);
}
复制代码对比下来可以知道await-to-js会直接把错误返回，代码上也更为简洁
代码准备
下载代码
git clone https://github.com/scopsy/await-to-js.git
cd await-to-js
npm install
复制代码代码分析
调试代码
开启调试的作用是在单步调试中跟着作者的思路走，这里的test命令跑测试用例，可以提前在test.ts函数打上断点（如图二）~
查找的源码分析
/**
* @param { Promise } promise
* @param { Object= } errorExt - Additional Information you can pass to the err object
* @return { Promise }
*/
// 参数promise处理函数，类型为promise的泛型；errorExt为返回错误的附加参数，选传、类型为对象
export function to<T, U = Error> (
promise: Promise<T>,
errorExt?: object
// 返回值为捕获的错误error或者处理成功后的data
): Promise<[U, undefined] | [null, T]> {
return promise
.then<[null, T]>((data: T) => [null, data])
.catch<[U, undefined]>((err: U) => {
// 若有附加参数，利用Object.assign将其跟捕获的错误复制到同一个对象中
if (errorExt) {
const parsedError = Object.assign({}, err, errorExt);
return [parsedError, undefined];
}
return [err, undefined];
});
}
export default to;
复制代码