关于es7的async/await
在es6中新增了Promise对象来解决异步回调问题,使用Promise可以讲多层嵌套的回调函数展平,但是写代码和阅读依然有额外的负担。
下面这个列子讲述在ES6中得异步回调解决方案,在func1函数中返回一个Promise对象,在Promise对象中书写异步,接着就可以使用这个异步函数了,使用fn1.then(function1,function2),function1代表成功处理回调,function2代表失败处理回调
function func1(time){
// 返回一个Promise对象
return new Promise((resolve,reject)=>{
setTimeout(()=>{
//异步的状态
if(true){
resolve({status:1,msg:'ok',data:[1,2,3]});
}else{
reject({status:0,msg:'error'});
}
},time);
})
}
var fn1 = func1(1000);
fn1.then((json)=>{
console.log(json);
},(error)=>{
console.log(error);
})
在es7中新增了 async/await 两个关键词
- async 表示这是一个async函数,此函数需要返回一个Promise对象,
- await 可以等待一个Promise对象的resolve,并拿到结果。await只能用在async函数里面
- 捕捉错误:使用标准的
try catch
语法捕捉reject错误
下面这个例子使用了es7的async/await
关键词处理异步,
- 同样是把异步代码写到func1函数中,但是func1函数开头需要使用
async
关键字来表明自己是个async函数, - 接下来就可以运行这个async函数了,
let res = await func1()
使用await等待func1执行完成并接受resolve的结果,await关键字会让异步堵塞,直到Promise执行完成,才会继续往下面执行
注意:await必须在async函数里面,所以必须定义了一个func2,并使用async关键词修饰为异步函数
async function func1(time){
// 返回一个Promise对象
return new Promise((resolve,reject)=>{
setTimeout(()=>{
if(true){//异步的状态
resolve({status:1,msg:'ok',data:[1,2,3]})
}else{
reject({status:0,msg:'error'})
}
},time);
})
}
async function func2(){
console.log("先执行");
let res = await func1(1000);
console.log(res,'执行完第一个异步');
let res2 = await func1(500);
console.log(res2,'执行完第二个异步');
console.log("后执行")
};
func2();
await看起来就像是同步代码,所以可以理所当然的写在for循环里,await会按照顺序阻塞执行Promise。
var sleep = function(time,index){
return new Promise((resolve,reject)=>{
setTimeout(()=>{
resolve({name:'张三',age:25,index:index});
},time)
});
};
var run = async ()=>{
console.log('start');
for(let i=1;i<=10;i++){
try{
let result = await sleep(1000,i);
console.log(result);
}catch(e){
console.log(e)
}
}
console.log('end');
}
run();