JS异步处理的进化史深入讲解(3)

async function f() { return await 1 //await后面不是Promise的话,也会被转换为一个立即为resolve的promise }; f().then( res => console.log("处理成功",res))//打印出:处理成功 1 .catch(err => console.log("处理是被",err))////打印出:Promise{<resolved>:undefined}

错误处理

如果await后面的异步出现错误,等同于async返回的promise对象为reject,其错误会被catch的回调函数接收到。需要注意的是,当 async 函数中只要一个 await 出现 reject 状态,则后面的 await 都不会被执行。

let a; async function f(){ await Promise.reject("error") a = await 1 //该await并没有执行 } err().then(res => console.log(a))

怎么处理呢,可以把第一个await放在try/catch,遇到函数的时候,可以将错误抛出并往下执行。

async function f() { try{ await Promise.reject('error'); }catch(error){ console.log(error); } return await 1 } f().then(res => console.log('成功', res))//成功打印出1

如果有多个await处理,可以统一放在try/catch模块中,而且async可以使得try/catch同时处理同步和异步错误。

总结

通过以上六种javascript异步处理的常用方法,可以看出async/await可以说是异步终极解决方案了,最后看一下async/await用得最多的场景:

如果一个业务需要很多个异步操作组成,并且每个步骤都依赖于上一步的执行结果,这里采用不同的延时来体现:

//首先定义一个延时函数 function delay(time) { return new Promise(resolve => { setTimeout(() => resolve(time), time); }); } //采用promise链式调用实现 delay(500).then(result => { return delay(result + 1000) }).then(result => { return delay(result + 2000) }).then(result => { console.log(result) //3500ms后打印出3500 }).catch(error => { console.log(error) }) //采用async实现 async function f(){ const r1 = await delay(500) const r2 = await delay(r1+1000) const r3 = await delay(r2+2000) return r3 } f().then(res =>{ console.log(res) }).catch(err=>{ console.log(err) })

可以看出,采用promise实现采用了很多then进行不停的链式调用,使得代码变得冗长和复杂且没有语义化。而 async/await首先使用同步的方法来写异步,代码非常清晰直观,而且使代码语义化,一眼就能看出代码执行的顺序,最后 async 函数自带执行器,执行的时候无需手动加载。

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://www.heiqu.com/272532cfdfdde3c5b8b8609cfe422ad4.html