Javascript 需要帮助找出此对象未定义的原因吗
我正在写一个游戏,到目前为止,我对代表游戏玩板的对象的了解是Javascript 需要帮助找出此对象未定义的原因吗,javascript,jquery,algorithm,oop,Javascript,Jquery,Algorithm,Oop,我正在写一个游戏,到目前为止,我对代表游戏玩板的对象的了解是 // define game object function Game ( board, numBlocks ) { // board: Raphael object that the snake will live on // numBlocks: Number of blocks both horizontally AND vertically -- the grid structure should be
// define game object
function Game ( board, numBlocks ) {
// board: Raphael object that the snake will live on
// numBlocks: Number of blocks both horizontally AND vertically -- the grid structure should be squares
this.board = board;
this.numBlocks = numBlocks;
this.snake; // Snake object on the board
this.openCoords = []; // coordinates on which the snake is not living at the moment
this.food = null; // food element on board
this.getAllCoords = function ( )
{
// returns list of all grid coordinates on the canvas,
// e.g. [{x:0,y:0}, {x:0,y:1}, ..., {x:15, y:15}] on a 16x16 board
var retList = [];
for (var i = 0; i < this.numBlocks; ++i)
for (var j = 0; j < this.numBlocks; ++j)
retList.push({ x : i, y : j });
return retList;
}
this.Snake = function ( )
{
// start with 3 blocks in the center-ish
var blockWidth = this.board.getSize().width / this.numBlocks;
var centerCoord = this.openCoords[this.openCoords.length / 2];
var headElement = new elementOnGrid(
board.rect(centerCoord.x * blockWidth, centerCoord.y * blockWidth, blockWidth, blockWidth, 5).attr('fill', '#19FF19'),
centerCoord.x,
centerCoord.y
);
}
this.elementOnGrid = function ( elem, xpos, ypos )
{
// elem: Rapael element (see: http://raphaeljs.com/reference.html#Element)
// xpos, ypos: x and y grid coordinates of the current position of the element
return { elem: elem, pos : [xpos, ypos] };
}
this.placeFood = function ( )
{
var randIndex = randInt(0, this.openCoords.length);
var randCoord = this.openCoords[randIndex]; // get random x-y grid coordinate from list of open coordinates
var blockWidth = this.board.getSize().width / this.numBlocks; // width in pixels of a block on the board
if (this.food == null) // if food element hasn't been initialized
{
// initialize the food element
this.food = new this.elementOnGrid(
board.circle(randCoord.x * blockWidth + blockWidth / 2, randCoord.y * blockWidth + blockWidth / 2, blockWidth / 2).attr('fill', '#cf6a4c'), // place circle in random location on the board (see http://raphaeljs.com/reference.html#Paper.circle)
randCoord.x,
randCoord.y
); // set food to be new element of type elementOnGrid
}
else // food element has been initialized (game is in play)
{
// move the food element
// ...
}
this.openCoords.splice(1, randIndex); // remove from openCoords the element that
}
this.startNew = function ( ) {
this.openCoords = this.getAllCoords();
this.snake = new this.Snake();
this.placeFood();
}
}
当我跑的时候
SG = new Game(snakeBoard, 16);
SG.startNew();
开始比赛
我知道这是某种类型的范围/继承/提升等问题,但我不能确切指出问题所在。奇怪的是,我刚刚创建了this.Snake(){…}
function/object,在此之前的行var blockWidth=this.board.getSize().width/this.numBlocks代码>在this.placeFood(){…}
函数中没有引起任何问题,尽管我看不出它有什么根本性的不同
您认为这是一个范围问题是正确的。您以前使用placeFood()
所做的与现在使用Snake()
所做的不同之处在于new
关键字
new
关键字告诉函数管理自己的此
,因此您的游戏
上下文不再适用于Snake
函数中的此
一种解决方案是像这样将上下文传递到Snake
函数中
this.snake = new this.Snake(this);
this.Snake = function(game) {
var blockWidth = game.board.getSize().width / game.numBlocks;
...
// replacing `this` with `game` for all relevant properties
然后像这样管理Snake
构造函数中的上下文
this.snake = new this.Snake(this);
this.Snake = function(game) {
var blockWidth = game.board.getSize().width / game.numBlocks;
...
// replacing `this` with `game` for all relevant properties
有关new
关键字的更多信息,请参阅。我想到了这一点,但这不就是复制游戏
来传递的吗?我希望避免不必要的大型元素副本。Javascript通过引用传递对象(因此您不必担心传递大型对象的副本)。有关按引用传递与按值传递的详细信息,请参见。