js 新语法 async await的使用
Posted 苏氏之道
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js 新语法 async await的使用相关的知识,希望对你有一定的参考价值。
随着es6的更新与普及新的语法又在es7、es8中推广与更进一步;
es5的同步处理请求的方式:
server.getUser().then((res) => { if (res.status == ‘success‘) { console.log(‘请求成功‘) getAddress(res.model.id) //成功后再继续发下一个请求 } else { console.log(‘请求失败‘) } }) function getAddress(userid){ server.getAddress({id:userid}).then((res) => { if (res.status == ‘success‘) { console.log(‘请求成功‘) //处理逻辑 } else { console.log(‘请求失败‘) } }) }
点评:此处至少有两个问题
1.代码没有加异常处理,如果接口返回失败或代码质量报错,会造成代码阻塞卡死应用;
2.嵌套发请求太落后已不适应当前前端的发展,造成可读性差;
修改一下用es6 的async awiat
try{ let user =awiat getUser(); if(user){ let address = awiat getAddress(user.id) //处理逻辑 } }catch(e){ console.error(e) } //...省略代码 上面两个方法报错不会阻塞后面代码的执行 //封装两个请求方法 async function getUser(){ let data = ‘‘; return new Promise(async (resolve, reject) => { try{ //加异常处理 data =await server.getUser(); if(data.status==‘success‘){ return resolve(data) }else{ return resolve(‘‘) } }catch(e){ reject(e) } }) } async function getAddress(id){ let data = ‘‘; return new Promise(async (resolve, reject) => { try{ //加异常处理 data =await server.getAddress({id:id}); if(data.status==‘success‘){ return resolve(data) }else{ return resolve(‘‘) } }catch(e){ reject(e) } }) }
以上是关于js 新语法 async await的使用的主要内容,如果未能解决你的问题,请参考以下文章
Swift新async/await并发中利用Task防止指定代码片段执行的数据竞争(Data Race)问题
Swift新async/await并发中利用Task防止指定代码片段执行的数据竞争(Data Race)问题
node.js async/await 与 MySQL 一起使用
JS255- 如何在 JS 循环中正确使用 async 与 await