async是Generator函数的语法糖,比起Generator更加具备语义。定义一个Generator函数须要相似于以下方式:ajax
function * test(){
yield 1;
yield 2;
return 3
}
var a = test() //不会执行
a.next();
a.next();
复制代码
定义async函数只须要:promise
async function test(){
var a = await 1
var b = await 2
return b
}
test().then((res)=>{ // res为test函数的返回值。可见async会返回一个Promise对象
})
复制代码
在实际使用中await后面实际上更多的是一个异步函数,例如一个promise对象的操做结果bash
// 模拟接口A
function getA(){
return new Promise((resolve,reject)=>{
setTimeout(()=>{
let res = Math.random()
if(res>0.5){
resolve(res)
} else {
reject(res)
}
},2000)
})
}
// 模拟接口B
function getB(){
return new Promise((resolve,reject)=>{
setTimeout(()=>{
let res = Math.random()
if(res>0.5){
resolve(res)
} else {
reject(res)
}
},2000)
})
}
async function print(){
let a = await getA().catch((error)=>{
console.log(error)
})
let b = await getB()
return [a,b]
}
print().then((res)=>{
console.log('成功',res)
}).catch((err)=>{
console.log('错误',err)
})
复制代码
上述print函数a变量值须要等到getA执行完毕才能得到。getB须要await getA()执行完毕才会执行。因此print的执行时间是getA和getB的和。这就是所谓的同步方式执行异步函数。 不过使用同步方式执行异步函数的方式也有局限性。dom
async function print(){
try{
let a = await getA()
}catch(error){
}
let b = await getB()
return [a,b]
}
复制代码
async使得异步操做流程更加有序化,在promise中异步
getA()
getB()
复制代码
虽然getA定义在前面,但却不必定会先于getB返回值,这样在实际开发中可能给咱们形成麻烦,由于实际开发中数据是由依赖的和有前后之分的。因此为了有序化,单纯使用promise咱们不得不使用以下相似代码:async
getA().then(()=>{
return getB()
}).then(()=>{
return getC()
})
...
复制代码
写的越多,代码就不具备可读性,也不利于调试。使用上述的async+await能够很爽地写代码啦.函数
async function getAsyncData(){
let a = await getA();
let b = await getB()
}
getAsyncData().then(()=>{
})
复制代码
咱们把异步操做的函数(例如ajax,读取文件等)定义在async函数内,配合await能够使得异步操做有序化,即先getA再执行getB.ui