2

我已经为我一直在研究的游戏的 Player 类创建了一个 Javascript 对象，该游戏使用以下行从 Collidable 类“继承”：

Player.prototype = new Collidable(50, 50, 70);

这个 Collidable 类有一个 Vector 类的实例，它在我的代码中被实例化，例如：

this.pos = new Vector(x, y) || new Vector(50, 50);

我的问题是我可以很好地创建一个新的 Collidable 对象，并且里面的向量将具有在该new Collidable(x, y, diameter)部分的前两个参数中给出的 x 和 y 的值。但是，当创建一个新玩家 ( current = new Player();) 时，向量的 x 和 y 值变为 NaN。

下面我包含了 Collidable 构造函数和 Player 构造函数的代码。

可碰撞：

Collidable = function Collidable(x, y, d){
    this.pos = new Vector(x, y) || new Vector(50, 50); // Position of centre
    this.diam = d || 50; // Diameter
    this.col = new Color().randomRGB(); // For debug
}
// More functions below

玩家：

Player = function Player(){
    this.health = 100;
    this.facing = 0;
    this.sprites = new Image();
    this.sprites.src = "./npc-oldman1.png";
    this.spriteNo = 0;
    this.moveSpeed = 2;
}

Player.prototype = new Collidable(50, 50, 70);
// More functions below

我怀疑这与这个问题有关，但无法弄清楚出了什么问题。

我的完整代码在这里可用。它应该做的是显示一个老人的图像，该图像移动到鼠标单击的位置（它会在开始时闪烁（50, 50）（创建播放器的位置），或者当您手动更改 pos 值时） . 在添加 Collisions 类之前，我已经让代码工作了。

提前致谢。

4

3 回答 3

2

问题似乎是嵌套对象的继承问题和new[不]使用构造函数继承的关键字/共享属性之间的混合。解决方案将是

function Player(){
    Collidable.call(this, 50, 50, 70); // give *this* instance an *own* Vector
    this.health = 100;
    this.facing = 0;
    this.sprites = new Image();
    this.sprites.src = "./npc-oldman1.png";
    this.spriteNo = 0;
    this.moveSpeed = 2;
}

Player.prototype = Object.create(Collidable.prototype); // without creating instance
于 2013-02-16T18:56:56.810 回答
1

您的vector.js代码会执行以下检查：

if (typeof x === 'NaN' || typeof y === 'NaN')

然而，typeof NaN == 'number'. 你想要isNaN(x)，或者更神秘地说，x != x

解决这个问题，很明显您的问题出在其他地方。这一行：

var diff = new Vector(this.getCentre.x - x, this.getCentre.y - y);

应该是以下之一：

var diff = new Vector(this.getCentre().x - x, this.getCentre().y - y);
var diff = this.getCentre().diff(new Vector(x, y))

有很多组缺少括号。

于 2013-02-16T20:33:45.533 回答
0

您的代码可能与您显示的问题不同。也许它不正常？我无法重现NaN，这是我使用的：

html

<div>Vector</div>
<div><span>X: </span><span id="x"></span><div>
<div><span>Y: </span><span id="y"></span></div>

js

var Vector = function(x,y){
 this.x = x;
 this.y = y;
}
var Collidable = function Collidable(x, y, d){
    this.pos = new Vector(x, y) || new Vector(50, 50);
}
var Player = function Player(){
    this.health = 100;
}
Player.prototype = new Collidable(50, 50, 70);

var current = new Player();

console.log(current);
console.log(current.pos);

document.getElementById("x").innerHTML = current.pos.x;
document.getElementById("y").innerHTML = current.pos.y;

演示：http: //jsfiddle.net/MuRNx/

于 2013-02-16T18:48:09.843 回答