[英]Javascript Issue - Uncaught TypeError: Cannot read property 'x' of undefined
I'm making a game where the rectangles are drawn at the top of the screen and move down towards the bottom. 我正在制作一个游戏,其中在屏幕顶部绘制矩形,然后向底部向下移动。 The rectangles will draw on the screen initially and then they will disappear and I will get the error "JavaScript Uncaught TypeError: Cannot read property 'X' of undefined" 矩形将首先在屏幕上绘制,然后消失,我将得到错误“ JavaScript Uncaught TypeError:无法读取未定义的属性'X'”
Below is the code and the error is on the "sprite.Rect.X" line 下面是代码,错误在“ sprite.Rect.X”行上
var gCanvas;
var gLoopCounter;
var gGameOver;
var gSprites;
function body_load() {
gameInit();
gCanvas = canGame.getContext("2d");
//canGame.onMouseDown = canCanvas_onMouseDown(e);
setInterval(gameLoop, 33);
}
function gameInit() {
gLoopCounter = 0;
gGameOver = false;
gSprites = new Array();
gSprites[0] = spriteNew("GreenYellow", 60, 30, 30, 70);
gSprites[1] = spriteNew("GreenYellow", 176, 30, 30, 70);
gSprites[2] = spriteNew("GreenYellow", 292, 30, 30, 70);
gSprites[3] = spriteNew("GreenYellow", 408, 30, 30, 70);
gSprites[4] = spriteNew("GreenYellow", 524, 30, 30, 70);
gSprites[5] = spriteNew("GreenYellow", 176, 130, 30, 70);
gSprites[6] = spriteNew("GreenYellow", 292, 130, 30, 70);
gSprites[7] = spriteNew("GreenYellow", 408, 130, 30, 70);
gSprites[8] = spriteNew("GreenYellow", 292, 230, 30, 70);
//Ship
gSprites[9] = spriteNew("MediumSpringGreen", 230, 950, 150, 20);
}
function gameLoop() {
gameUpdate();
gameDraw();
}
function gameUpdate() {
gLoopCounter++;
if (gLoopCounter === 30) {
gLoopCounter = 0;
for (var i = 0; i < gSprites.length; i++) {
gSprites[i].Rect.Y += 5;
}
}
function gameDraw() {
gCanvas.fillStyle = "black";
gCanvas.fillRect(0, 0, 640, 1096);
for (var i = 0; i < gSprites.length; i++) {
var sprite = gSprites[i];
gCanvas.fillStyle = sprite.Color;
gCanvas.fillRect(
sprite.Rect.X,
sprite.Rect.Y,
sprite.Rect.Width,
sprite.Rect.Height);
}
if (gGameOver === true) {
gCanvas.fillStyle = "white";
gCanvas.font = "30px American Typewriter";
gCanvas.textBaseline = "middle";
gCanvas.textAlign = "left";
gCanvas.fillText("Game Over", 100, 200);
}
}
function spriteNew(color, x, y, width, height) {
var sprite = new Object();
sprite.Color = color;
sprite.Rect = rectNew(x, y, width, height);
return sprite;
}
function rectNew(x, y, width, height) {
var rect = new Object();
rect.X = x;
rect.Y = y;
rect.Width = width;
rect.Height = height;
return rect;
}
}
You need to move the closing curly brace for the gameUpdate
function so that it comes before the gameDraw
function. 您需要移动gameUpdate
函数的gameUpdate
花括号,使其位于gameDraw
函数之前。
Do not include your ship in the gSprites array, or else it will move down with the other rectangles. 不要在gSprites数组中包含飞船,否则飞船将与其他矩形一起向下移动。
Also learn the javascript shortcuts, new Object()
, can be replace with {}
and new Array() can be replaced with []
. 还可以学习javascript快捷键new Object()
,可以将其替换为{}
而new Array()可以将其替换为[]
。
I made the edits here (I removed the on body load event since jsfiddle handles this for you, so add it back in). 我在这里进行了编辑(由于jsfiddle为您处理了此事件,因此删除了on body load事件,因此请重新添加)。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.