async 异步代码同步化处理

最新推荐文章于 2024-06-27 10:14:43 发布

黄祚敏

最新推荐文章于 2024-06-27 10:14:43 发布

阅读量1.3k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： es6 文章标签： async 同步异步转同步

本文链接：https://blog.youkuaiyun.com/github_38186390/article/details/86636988

es6 专栏收录该内容

3 篇文章

订阅专栏

本文深入探讨了async函数作为Generator函数的语法糖的作用，详细解释了如何使用async和await实现同步流程控制，以及与Promise的不同之处。通过实例展示了async函数在处理异步操作时的便利性和逻辑清晰度。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一。async就是 Generator 函数的语法糖。

二。async使用说明。

（1）函数前面加上async字段。例如：

async function asyncFunction() {} 
    // or
let asyncFunction = async function () {}

（2）在需要同步的函数前面加上await字段使其同步。对于await同步的表达式需要返回Promise。返回Promise.resolve()则继续往下执行，返回Promise.reject()则报错不再继续执行。我们可以使用try {} catch (e) {} 将错误进行捕获。需要依次成功执行的放在try里面就可以了。例：

async function asyncFunction() {
        try {
            await cesOne()
            await cesTwo()
            return await '3'
        } catch (e) {
            console.log(e)
        }
    }

    function cesOne() {
        return new Promise((resolve, reject) => {
            setTimeout(() => {
                console.log('1')
                resolve('第一步') // 如果返回的是reject，try里面余下的步骤不再走。
            }, 1010)
        })
    }

    function cesTwo () {
        return new Promise((resolve, reject) => {
            setTimeout(() => {
                console.log('2')
                resolve('第二步') // 如果返回的是reject，try里面余下的步骤不再走。
            }, 100)
        })
    }

asyncFunction().then((result) => {
  console.log(result)
})
// 依次输出：1 2 3

三。其他说明：async函数只是在函数内部是同步的，函数外还是异步执行的。

四。对比promise同步的实现。

promise同步实现是通过 then 里面进行调用实现的同步，看起来是链式结果，不如async 这样一步一步的执行看起来符合逻辑。