Javascript TypeError，无法访问对象的方法

Question

我正在使用 p5.js、node.js 和 socket.io 在浏览器中制作小型多人游戏。一个名为 'player' 的对象从一个客户端传递到另一个客户端以同步两个客户端。这适用于不依赖于方法调用的其他代码。但是现在我还想访问播放器对象中存储对象的方法，它不再起作用了。

这将是存储所有变量的对象和两个客户端之间的对象数组：

var player = {
  structures: []
};

现在，如果我像这样向其中添加一个名为 campfire 的对象：

player.structures.push(new campfire(mouseX,mouseY));

并尝试调用对象 campfire 的 draw() 方法，如下所示：

class campfire {
constructor(x,y){
    this.scale = 40;
    this.x = x;
    this.y = y;
    this.maxLevel = 3;
    this.button = new button(this.x, this.y+50, this.x-50, this.y-70, upgrade, upgrade_hover, this);
    this.show_upgrade_button = true;
}

draw(){
    switch(player.campfire.level){
        case 1: image(fire, this.x, this.y, this.scale, this.scale);break;
        case 2: image(campfire_2, this.x, this.y, this.scale, this.scale);break;
        case 3: image(campfire_3, this.x, this.y, this.scale, this.scale);break;
        default: console.log("cant upgrade, this shouldn't happen.");
    }
    if(this.show_upgrade_button){
        this.button.draw();
    }
}

trigger(){      
    if(player.campfire.level + 1 <= this.maxLevel && this.show_upgrade_button == true){
        this.button.trigger();
    }
}}

使用

player.structures[i].draw();

控制台（客户端未将对象 'campfire' 推送到数组 'structures'）打印以下错误：

gui.js:38 Uncaught TypeError: player.structures[i].draw is not a function

将 campfire 对象推送到数组的客户端能够进行 draw() 调用并且不会打印错误消息。然而，没有将对象推送到数组的其他客户端无法使用该方法并打印出错误，即使它们共享相同的 'player' 对象。奇怪的是，打印出错误的那个仍然能够访问 campfire 对象的所有变量，所以它似乎只影响方法。

我找到的关于此的唯一资源是这篇文章 https://airbrake.io/blog/javascript-error-handling/x-is-not-a-function-typeerror 我试图将函数重命名为 draw = function(){} 和 campfire.prototype.draw = function(){} 但这对我没有影响。我认为函数没有声明对吗？这将是我现在唯一可能的解释。

感谢您花时间阅读我的问题！

编辑：这里是项目的link：https://github.com/Mayhoon/Multiplayer-Browsergame

Answer 1

我觉得你的问题更多是设计层面的。 Socket.io（或任何其他同步库）并不是真的要来回推送整段代码。在你的情况下，这将是营火的功能。

我建议只来回推动 state。玩家有锤子吗？玩家有多少生命？玩家有营火吗？换句话说，只同步不断变化的数据。

由于营火的功能（绘制功能）对所有玩家都是相同的，因此无需每隔几秒就来回推送该代码！这是相当低效的！

相反，当您的同步对象显示玩家有篝火时，您可以在客户端中创建篝火实例。

在代码中可能看起来像这样（只是一个想法）：

socket.io

的同步对象

var player = {
  structures: {campfire:true}
};

客户代码

// create campfire instances, tell the campfire which player it belongs to
if(player.structures.campfire) {
    let cf = new Campfire(player)
    cf.draw()
}

注意：很可能是 socket.io 剥离了可执行代码

Javascript TypeError，无法访问对象的方法

Javascript TypeError, can’t access methods of object

javascript

object

typeerror

p5.js