序文
日常の開発では、多かれ少なかれ誰もが非同期関数を使用すると思います。私と同じくらいtry catch知っている一緒にawait-to-jsの使い方とソースコードを学びましょう! ソースコード＋コメントはたったの22行！
収穫リスト
- await エラーを適切にキャッチする
- ソースコードをデバッグする
await-to-js アプリケーション
序章
非同期待機ラッパーがエラー処理を容易にするという趣旨の正式な紹介は次のとおりです。
使用
旧ルール、使用方法はreadme参照。このとき、try catchよく使っている、なぜエラーをキャッチするためにライブラリを導入する必要があるのか、それを選択する理由は何なのか、と言う人もいるかもしれません。ことわざにあるように、比較なしに害はありません。2つの使用法を比較しましょう
エラーをキャッチする 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.tsデバッグを有効にする役割は、シングル ステップ デバッグにおける著者の考え方に従うことです.ここでは、テスト コマンドはテスト ケースを実行し、事前に関数にブレークポイントを設定できます (図 2 を参照)~
ソースコード分析を見つける
/**
* @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;
复制代码