async/await学习

详情可以查看我的博客：async/await学习

1.async函数

• 函数的返回值为promise对象
• promise对象的结果由async函数执行的返回值决定

执行下列代码：

async function fun1(){
    return 1
}
const result = fun1()
console.log(result)

执行结果：可以看到调用fun1()函数后，返回的结果并不是1，而是一个promise对象

那么，我们要如何得到promise的返回值呢？执行下列代码：（promise对象的结果，是由执行async异步函数所返回的结果决定的）

async function fun1(){
     return 1 //打印 onResolved 1
    // throw 2 // 打印 onRejected 2
    // return Promise.reject(3) //打印 onRejected 3
    // return Promise.resolve(4) //打印 onResolved 4
}
const result = fun1()
result.then(
    value => {
        console.log('onResolved',value)
    },
    reason => {
	console.log('onRejected',reason)
    }
)

2.await

• await右边的表达式一般为promise对象，也可以是其他值
• 如果右边是promise对象，那么await返回的是promise成功的值
• 如果右边是其他值，直接将此值作为await的返回值

执行下列代码：可以看到fn1的返回值是一个promise对象，使用await fn1()表达式可以在1000ms后得到promise执行成功的值，即2

function fn1(){
    return new Promise((resolve,reject)=>{
        setTimeout(()=>{
            resolve(2)
	},1000)
    })
}
async function fn2(){
    const res = await fn1()
    console.log(res) //打印 2
}
fn2()

执行下列代码：fn1的返回值不是promise对象，而是数值3，那么直接把fn1函数返回值作为await的返回值

function fn1(){
    return 3
}
async function fn2(){
    const value = await fn1()
    console.log('value',value) //打印 value 3
}
fn2()

3.注意

• await必须写在async函数中，但async函数中可以没有await
• 如果await的promise失败了，就会抛出异常，需要通过try catch来捕获错误，可以看到在下面的代码中捕获到的error就是promise对象失败的结果

function fn1(){
    return new Promise((resolve,reject)=>{
        setTimeout(()=>{
            reject(666)
        },1000)
    })
}
async function fn2(){
    try{
	const res = await fn1()
    }catch(error){
        console.log(error) //打印 666
    }
}
fn2()