async await

浅浅的花香味﹌ 2023-07-03 06:25 18阅读 0赞

###  async: ###

async相当于Promise的语法糖，函数前边加上async，函数里边return返回一个值**(实际上返回的是一个promise对象)**，相当于下边写法，里边如果抛出异常，相当于promise的rejected状态：

async function test() {
       return 1
    }
    const res1 = test()
    console.log(res1)
    // 相当于
    function test() {
       return new Promise((resolve, reject) => {
           resolve(1)
       })
    }
    const res2 = test()
    console.log(res2)

![20200203165752616.png][]

###   await: ###

await需要放在async里边，2个天生是一对，await后边的函数是一个异步请求函数，必须返回一个Promise对象；await还有一个作用就是：对后变函数求值** : **

async function test() {
       const res = await scyncFn()
        console.log(res)
    }
    const res1 = test()

### **tips:** ###

**1、使用async await， 当前线程会被阻塞 ，也就是说，一个异步请求，会变成同步执行，例如：**

下边，我在node koa中间件中请求百度地址，会发现最后输出结果顺序就是同步执行的。证明：使用async await，可以一个异步请求，变成同步执行的代码。

const Koa = require('koa')
    const $axios = require('axios')
    const app = new Koa()
    app.use( async (ctx, next) => {
        console.log('3')
        const res = await $axios.get('https://www.baidu.com')
        console.log(res)
        console.log('4')
    })
    app.listen(3000)
    // 输出结果
    /*
    
    '3'
    {status:200, header:{} ··· ···}
    '4'
    
    
    */

**2、只要加上async 的函数，里边的返回的任何值，都会被包装成一个Promise对象，函数无返回值时，实际上内部会返回一个undefined，此时undefined会被包装成一个Promise对象：**

![20200210101236412.png][]

** 3、使用await 调用函数执行，此函数必须返回一个Promise对象，如果此函数里边使用setTimeout模拟异步，setTimeout需要放在Promise对象里：**

function test1() {
        return new Promise((resolve, reject) => {
            setTimeout(() => {
                resolve('1')
            }, 2000)
        })
    }
    
    async function test() {
        const res = await test1()
        console.log(res) // 2秒之后返回 ’1‘
    }
    test()

**4、对于异步函数的异常捕获：**

（在项目中，通常会把获取到的数据这样处理： if(!res) return false，这样做法会把异常信息丢失掉，下边我们可以使用 把获取到的const res = await err( ) 放在 try\{\}catch()\{\} 进行捕获异常， 如果异步函数有异常，直接可以捕获到！！！）

function err() {
        return new Promise((resolve, reject) => {
            setTimeout(() => {
                reject('失败')
            }, 2000)
        })
    }
    
    async function test() {
        try {
            const res = await err()
            console.log(res) // 2秒之后返回 ’1‘
        }catch (e) {
            console.log(e)
        }
    }
    test()

[20200203165752616.png]: https://img-blog.csdnimg.cn/20200203165752616.png
[20200210101236412.png]: https://img-blog.csdnimg.cn/20200210101236412.png