js的async和await

1 async和await

async和await是都用于方法名称前的
await必须写在async方法的内部
await 只能使用在原生语法中，比如在 forEeach 结构中使用 await 是无法正常工作的，必须使用 for 循环的原生语法
个人理解：async的方法对外是异步的，而使用了await的方法后，在内部是同步的

async fun1(){
    await fun2()
    await fun3()
    await fun4()
}

fun2、fun3、fun4会依次执行

2 element-ui中多个通知会叠加显示的问题

原因：我的理解就是vue的缓冲机制，导致前面的还没执行完成，后面的获取不到前面的数据
解决：需要等待前面的通知操作完成后，再执行后面的通知操作

async openMessages(){
        for(var i=0;i<2;i++){
               await this.$notify({  //等待前面的通知完成后再显示后面的
               title: '警告',
               message: '这是一条不会自动关闭的消息',
               type: 'warning',
               duration:10000,
       })
    }
}

参考文档：element-ui Notification重叠问题，原因及解决办法

3 websocket了解

WebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议
WebSocket 允许服务端主动向客户端推送数据
在 WebSocket API 中，浏览器和服务器只需要完成一次握手，两者之间就直接可以创建持久性的连接，并进行双向数据传输（websocket是一直在线状态的，就像QQ一样）
过程：
- 先发出HTTP请求，建立一条连接
- 通过send()方法向服务端发送请求，或通过onmessage事件接收服务端数据
- 关闭连接

 function WebSocketTest(){
            if ("WebSocket" in window){
               alert("您的浏览器支持 WebSocket!");

               // 打开一个 web socket
               var ws = new WebSocket("ws://localhost:9998/echo");

               ws.onopen = function() {
                  // Web Socket 已连接上，使用 send() 方法发送数据
                  ws.send("发送数据");
                  alert("数据发送中...");
               };
                
               ws.onmessage = function (evt) { 
                  var received_msg = evt.data;
                  alert("数据已接收...");
               };
                
               ws.onclose = function(){ 
                  // 关闭 websocket
                  alert("连接已关闭..."); 
               };
            }else{
               // 浏览器不支持 WebSocket
               alert("您的浏览器不支持 WebSocket!");
            }
}

学习文档：菜鸟教程