Promise 易讀性不好? async 與 await 就是要解決這個問題 !
在 ajax 技術出現之後,前端可以用非同步的方法抓取資料或是做一些比較複雜的計算,避免網站在進行到這一步時完全卡死。
而在最早期,JavaScript 是使用 callback function 來完成這個工作,但是他卻有一個大問題就是 callback hell,Promise 就是為了解決這個問題而出現的。
但是 promise 的寫法在易讀性上有些困難,而 async 以及 await 的工作就是為解決這個問題(是的他的工作就是這麼單純)。
接下來之接用 code 來展示兩個寫法的差異。
Promise
let makeNewVideo = true;
function check(){
return new Promise((resolve, reject)=>{
if(maekeNewVideo){
resolve("new video uploaded");
}else{
reject("no new video");
}
})
}
check()
.then((res)=>{
conosle.log(res)//成功的話傳到這 "new video uploaded"
})
.catch((err)=>{
console.log(err)//失敗的話傳到這 catch method "no new video"
})
async await
let makeNewVideo = false
async function check(){
try{
const res = await new Promise((reaolve, reject)=>{
if(makeNewVidoe){
resolve("new video upload");
}else{
reject("no new video")
}
})
console.log(res)
}catch(err){
console.log(err)
}
}