javascript - 没有分配功能的 Web Sockets 对象
问题描述
我正在使用带有 express 和 socket.io 的 javascript (p5.js) 和 node.js。
这是我当前代码的一部分,我认为问题在于:
for (var i = 0; i < 3; i ++){
for (var j = 0; j < 3; j ++){
for (var k = 0; k < 3; k ++){
for (var l = 0; l < 3; l ++){
socket.emit('grid', grid[i][j][k][l]);
}
}
}
}
socket.on('grid', test);
}
function test(gridElement){
gridElement.show();
console.log('showing');
}
这个想法是有一个 4 维“网格”,网格中的每个元素都是一个 CELL。每个单元格都具有与其关联的以下属性:
function Cell(x, y, w, val){
this.x = x;
this.y = y;
this.w = w;
this.revealed = true;
this.val = round(val);
}
Cell.prototype.show = function(){
rect(this.x, this.y, this.w, this.w);
text(this.val, this.x + this.w/2, this.y + this.w/2);
}
正如它所说,每个单元格都有一个“显示”功能来显示单元格。这通常有效。
问题是,在我从服务器发出元素后,并尝试运行:
gridElement.show();
我收到一条错误消息,提示“gridElement.show 不是函数”
关于什么是错的以及如何解决它的任何想法?如果需要,我有服务器代码。
解决方案
您可以在客户端和服务器之间发送单元格数据,但是当它到达另一端时,它将是一个普通对象而不是一个单元格对象。socket.io 使用 JSON 作为数据传输格式,JSON 不保留对象的类型,只保留对象的数据。
您必须编写代码将其转换为带有您的方法的 Cell 对象。通常,可以通过为您的对象创建一个接受普通对象作为参数的构造函数来做到这一点,它会从该普通对象中获取数据,然后当您从另一端接收该数据时,您会创建一个新的 Cell 对象并将您刚刚收到的数据传递给它:
function Cell(data) {
this.x = data.x;
this.y = data.y;
this.w = data.w;
this.val = data.val;
}
socket.on('grid', function(data) {
// data here is a plain object
let gridElement = new Cell(data);
gridElement.show();
});
或者,使用您的问题已经显示的构造函数:
socket.on('grid', function(data) {
// data here is a plain object
let gridElement = new Cell(data.x, data.y, data.h, data.val);
gridElement.show();
});
推荐阅读
- java - 有没有一种快速的方法可以使用 java 获取设备上的所有音频文件?
- c++ - 使用 Visual Studio 2019 如何为没有解决方案的 C++ 代码克隆 github 存储库并构建和运行它们?
- elasticsearch - 如何在 Elasticsearch 中仅向前创建 ngram?
- git - 如何使用 SSH 登录 Github 并在命令行中创建新的存储库?
- database - Neo4j 图形性能:我应该在单独的数据库中缓存慢查询吗?
- azure - Azure IoT Central 发布错误出错了错误代码:400.470.006.319 / 2093ej9xx7l.4
- python - 如何在pygame中一起制作两个文件?
- flutter - 如果 StreamBuilder 获取 null 显示 Flutter 中的不同小部件
- docker-registry - Docker Registry V2 API - 推送图像 - 上传 (PATCH) 失败并显示 404
- angular - 在Angular 6中自动调用函数的任何方式,看到ng-init都不起作用