向 websocket 发送请求后,数组有一个额外的未定义元素

array has an additional undefined element after sending request to websocket

所以,首先,对于您可能在这里发现的所有错误代码或错误名称,我深表歉意,这是我的第一个 javascript + 节点严肃项目

问题是这样的,我有一个名为 stats 的数组,我从中存储来自模块的数据

这主要是设置代码

var data = require("./data");
var stats = data.stats;

这是统计数据的样子:

var stats = [
    {
        name: "test",
        value: 0,
        id: "0ps",
        isPositive: true
    }
];

问题出在我向 websocket 发送请求以删除任何统计信息(在本例中为 0ps)

这是前端的 websocket

function load_socket() {
  socket = new WebSocket("ws://localhost:" + socketport, "main");

  socket.addEventListener("open", function (event) {
    console.log("connected");
  });

  socket.addEventListener("message", function (event) {
    var msg = JSON.parse(event.data);
    if (msg.operation == "listChecks") {
      checks = msg.checks;
      table.innerHTML = "";
      loadCheckboxes()
    }
    if(msg.operation == "listStats"){
      stats = msg.stats;
      statTableP.innerHTML = "";
      statTableN .innerHTML = "";
      loadStats();
    }
  });
}

socketport 设置为 4444 或环境变量 PORT

这是后端的 websocket

wsServer.on("request", function(request){
    var connection = request.accept("main", request.origin);
    connections.push(connection);
    listChecks(connection);
    listStats(connection);
    console.log("Client Connected");
    connection.on("message", function(message){
        if(message.type ==="utf8"){
            var msg = JSON.parse(message.utf8Data);
            if(msg.operation="add_stat"){
                stats.push(msg.newstat)
                for(var i = 0; i<connections.length;i++){
                    listStats(connections[i]);
                }
            }
            if(msg.operation="delete_stat"){
                console.log(stats.length);//this outputs 2 somehow
                // as you can see this function does practically nothing
                // only re-lists stats, at the moment
                //const newStats = stats.filter(stat => stat.id != msg.id)
                //stats = newStats;
                for(var i = 0; i<connections.length;i++){
                    listStats(connections[i]);
                }
            }
            if(msg.operation="reload_stat"){
                for(var i = 0; i<connections.length;i++){
                    listStats(connections[i]);
                }
            }
        }
    })
    connection.on("close",function(reasonCode, description){
        connections.splice(connections.indexOf(connection),1);
    });
});

注意:我删除了一些操作,否则代码块会变得太长

这是后端的listStats函数

function listStats(connection){
    connection.sendUTF(JSON.stringify({
        operation: "listStats",
        stats: stats
    }))
}

实际问题

好的所以当我调用操作时问题就来了 delete_stat 当我这样调用时(这是在一个单元格内,单元格包含按钮和 2 个输入,我需要获取的输入具有 class sIn,我用它来获取 ID)

//note this references the button inside the cell
deleteStat(this.parentNode.querySelector(".sIn").id)

这就是 deleteStat 所做的

function deleteStat(id) {
  socket.send(JSON.stringify({
    operation: "delete_stat",
    id: id
  }));
}

当我调用这个函数时,服务器上的统计数据数组是这样的:

    [{
        name: "test",
        value: 0,
        id: "0ps",
        isPositive: true
    }]

不知何故

    [{
        name: "test",
        value: 0,
        id: "0ps",
        isPositive: true
    },
    undefined
]

那里的未定义将 stats 数组的长度增加 1,这完全打破了任何循环 我可以从数组中过滤掉 undefined,但这并不是我真正想做的,我想知道它为什么会出现以及将来如何防止它

最后一个音符

我完全是 js 和 node 的新手,我不想听起来很粗鲁,但请让您的解决方案尽可能简单易懂,想象一下您正在写信给有史以来最健忘的 child

这个 if(msg.operation="add_stat"){ 总是会在堆栈上压入一些东西。

改为if(msg.operation==="add_stat"){