要点:async语法
一、async语法
1.async也是处理异步的,它是对Promise的扩展,也让异步更加方便
2.优势:async 是基于Promise的,虽然是异步操作,但看上去像同步
3. async 的基本语法:
let p1=new Promise((resolve,reject)=>{ setTimeout(()=>{ resolve('1.异步'); },3500); }) let p2=new Promise((resolve,reject)=>{ setTimeout(()=>{ resolve('2.异步'); },800); }) let p3=new Promise((resolve,reject)=>{ setTimeout(()=>{ resolve('3.异步'); },1500); }) // 创建一个async函数,执行异步操作 // await 关键字 :等待异步执行完毕后回调 let as = async() =>{ let result=await p2; console.log(result); } // 执行async函数 as(); //2.异步
ps: 上面语法,用ES5 过渡一下,为
async function as(){ let result=await p3; console.log(result); } as(); //3.异步 let as =async function(){} let obj={async as(){}} //也支持对象方式
4.如果有三个异步需要操作列队输出,我们用async语法来处理一下
// 多个异步,按输出顺序加载,没有then,清晰很多 async function as(){ let r1 =await p1; r2 =await p2; r3 =await p3; console.log(r1); console.log(r2); console.log(r3); } as();
ps: 1.await 关键字只能在async函数内部,否则不可识别
2.async语义和清晰度都得到了很大提升,更像同步代码
// 批量异步列队,类似Promise.all() async function as(){ let all=[await p1,await p2,await p3]; console.log(all); //[ '1.异步', '2.异步', '3.异步' ] } as();
5.async函数如果设置了返回值,这个值是Promise对象
// 返回值是Promise对象 // 相当于Promise.resolve() async function as(){ return 'hello,async!'; } as().then(value=>{ console.log(value); //hello,async! })
ps:如果return await p1 ,这种,会导致提前输出 pending 状态 ,还是需要 then
async function as(){ return await p1; } console.log(as()); //Promise { <pending> } 得到的是Promise对象的pending状态 as().then(value=>{ //这里还需要then console.log(value); //1.异步 })