es6使用websocket同步等待方法

最新推荐文章于 2025-06-27 09:03:09 发布

ezLeo

最新推荐文章于 2025-06-27 09:03:09 发布

阅读量1.4w

点赞数 4

CC 4.0 BY-SA版权

分类专栏： js

本文链接：https://blog.csdn.net/myiloveuuu/article/details/79611301

js 专栏收录该内容

4 篇文章

订阅专栏

本文介绍了JavaScript中Promise的基本使用方法及其如何实现同步等待操作。同时深入探讨了ES6引入的async/await关键字，展示了如何利用它们编写更简洁、易读的异步代码。文章还特别关注了如何通过Promise与async/await结合处理WebSocket等回调函数，实现真正的同步等待。

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

之前对于Promise相当不了解，同步等待函数都是用的其他的库，后面发现es原生的Promise其实完全可以支持同步等待操作，以此记录，希望后面人少走弯路。

promise

Promise的参数是一个函数，函数就是要等待执行的什么内容，这个函数的参数有两个，一个是resolve，一个是reject。通过主动调用resolve就可以控制promise的结束。

Promise(funciton(resolve, reject){
    resolve();
})

async/await

es6有了一个新的关键字 await/async，可以达到编写同步代码的目的。比如等待时间到了执行后面的内容就可以写成

async waitOneSecondToExe(){
    await setTimeout(function(){}, 1000);
    doSomething();
}

await同步等待的内容是一个Promise对象，当然不是Promise对象await也不会报错，但是也没有任何作用了。

同步等待一个回调函数

await一个函数好理解，但是await一个回调函数怎么办呢。我现在想等待websocket返回结果再执行后面的内容如何做呢？

//socket接收到数据然后执行doSomething
function recvData(){
    socket.on("recvData", function(data){
        console.log(data);
    });
    doSomething();   
}

如上面的代码肯定是不行的，recvData中的socket.on函数仅仅是进行了注册，我的期待是doSomething在socket接收到数据后才执行，那么怎么办呢?

async function recvData(){
    await new Promise((resolve) => 
        {
            socket.on("recvData", function(data){
                console.log(data);
                resolve();
            })
        });
    doSomething();
}

通过主动调用resolve函数，会把Promise内部的状态设置为已完成，await等待的Promise就会得到结果，执行下面的程序内容。达到同步等待会调函数的目的