停止像這樣使用 "Async/Await",改用原版
最近我看到一些開發(fā)者使用這種方法來處理 async/await 錯誤。
/**
* @param { Promise } promise
* @param { Object= } errorExt - Additional Information you can pass to the err object
* @return { Promise }
*/
function to(promise, errorExt) {
return promise
.then((data) => [null, data])
.catch((err) => {
if (errorExt) {
const parsedError = Object.assign({}, err, errorExt);
return [parsedError, undefined];
}
return [err, undefined];
});
}
async function doSomething() {
const [error1, result1] = await to(fetch(''));
if (error1) {
return;
}
const [error2, result2] = await to(fetch(result1));
if (error2) {
return;
}
// ...
}
正如你所看到的,他們把函數(shù)包起來,把原來的Promise轉換成一個肯定會成功的 "Promise",并返回一個數(shù)組。
如果原始的Promise成功了,那么數(shù)組中的第一項是空的,表示沒有錯誤,第二項是原始 Promise的結果。如果原來的Promise失敗了,那么數(shù)組的第一項是錯誤,第二項是未定義。就是這樣了。
他們認為這很優(yōu)雅,使代碼更易讀。但我不這么認為,我也不建議這樣使用它
我認為這樣的封裝有點過度,在大多數(shù)情況下,不需要這樣做。接下來,我將從兩個角度說明我的觀點。
1、從設計的角度來看
Async/await? API的目的是允許開發(fā)者像寫同步代碼一樣寫異步代碼。因此,可以使用try...catch?來捕獲async/await錯誤。
而這樣的函數(shù)似乎為我們考慮到了一切,但其他剛看到你的代碼的開發(fā)者總會有這樣的疑問。為什么to?函數(shù)返回的Promise所使用的await?沒有用try...catch來包裝?
只有找到原始的to?函數(shù)定義,并理解其意圖,你才能知道 "啊,原來to函數(shù)返回的 Promise 永遠不會被拒絕"。
所以它進一步增加了其他開發(fā)者的理解成本,使得熟悉的 async/await 變得不再 "熟悉"。
2、從實用性的角度來看
to?函數(shù)的主要使用情況是,在同一上下文中有多個await promises?,而它們相應的錯誤處理方式是不同的。那么就使用這個封裝函數(shù)對每個錯誤進行不同的處理,減少對try...catch的使用。
但在實際開發(fā),在每個到函數(shù)之后,你需要使用if?語句來確定是否有錯誤。這與使用try...catch的本意沒有什么不同,都是為了檢查錯誤。
其次,在真實的生產環(huán)境中,下一個Promise依賴上一個Promise的情況并不少見。但重要的一點是,這兩個Promise通常是關聯(lián)函數(shù)。所以在外層使用try...catch來統(tǒng)一處理錯誤是沒有問題的。比如說:
最后,在JavaScript中,大多數(shù)Promise場景都是在 Input/output上,比如網(wǎng)絡IO和文件IO。這些IO場景可以將攔截器封裝在下層,并根據(jù)錯誤代碼統(tǒng)一處理。例如,使用axios攔截器。
所以它可能并不像預期的那樣實用。也就是說,它可能只用于整個項目的一小部分,而且成本超過了收益。
這就是我所有的觀點,你怎么看?你贊成這種做法嗎?