Javascript 游戏组件赢得'；t在添加if/else语句后绘制
添加if/else语句后，我的游戏组件不会绘制到画布上 声明仅检查游戏块是否击中游戏障碍物 我试着改变属性和重写一些函数，但问题似乎还没有解决 每当我删除if/else函数时，组件都会绘制 下面是保存if/else函数的部分代码：Javascript 游戏组件赢得'；t在添加if/else语句后绘制,javascript,html,Javascript,Html,添加if/else语句后，我的游戏组件不会绘制到画布上 声明仅检查游戏块是否击中游戏障碍物 我试着改变属性和重写一些函数，但问题似乎还没有解决 每当我删除if/else函数时，组件都会绘制 下面是保存if/else函数的部分代码： if（gamePieceBorder.crashGame（GameBarrierd）| | gamePieceRed.crashGame（GameBarrierd）） { gameArea.stop（）； } 其他的 { 障碍。更新（）； gamePieceBorde
if（gamePieceBorder.crashGame（GameBarrierd）| | gamePieceRed.crashGame（GameBarrierd））
{
gameArea.stop（）；
}
其他的
{
障碍。更新（）；
gamePieceBorder.pos（）；
gamePieceBorder.move（）；
gamePieceBorder.update（）；
gamePieceRed.pos（）；
gamePieceRed.move（）；
gamePieceRed.update（）；
gameArea.clear（）；
}
我怎样才能得到要绘制的组件？如果有人修复了代码，问题是什么？我不是javascript方面的专家，只是初学者。有几个问题：
应该是window.EventListenerwindow.addEventListener
和keyup
不应使用大写字母keydown
如果未定义（应该是游戏障碍
可能）障碍
方法应在绘图之前调用，而不是在绘图之后调用clear
/---------------------------------------变量
var配子片段；
var配子体边界；
var配子障碍；
//-----------------------------------------
//-----------------------------------------主要游戏功能
函数startName（）
{
gamePieceRed=新组件（22,22，“rgb（255,132,156）”，10120）；
gamePieceBorder=新组件（24,24，“黑色”，9,119）；
障碍=新组件（10200，“rgb（64,0,12）”，300120）
gameArea.start（）；
}
//-----------------------------------------
//-----------------------------------------创建游戏区域并应用控件
变种配子区=
{
canvas:document.createElement（“canvas”），start:function（）
{
this.canvas.width=510；
this.canvas.height=280；
this.context=this.canvas.getContext（“2d”）；
document.body.insertBefore（this.canvas，document.body.childNodes[0]）；
this.interval=setInterval（gameUpdate，20）；
window.addEventListener（“向下键”，函数（e）
{
gameArea.keys=（gameArea.keys | | |[]）；
gameArea.keys[e.keyCode]=true；
}，对）
window.addEventListener（“键控”，函数（e）
{
gameArea.keys[e.keyCode]=false；
}，对）
},
清除：函数（）
{
this.context.clearRect（0，0，this.canvas.width，this.canvas.height）；
},
停止：函数（）
{
clearInterval（这个.interval）；
},
键盘：函数（）{
如果（此.keys）{
如果（this.keys[37]）{gamePieceBorder.speedX=gamePieceRed.speedX=-2；}
else如果（this.keys[39]）{gamePieceBorder.speedX=gamePieceRed.speedX=2；}
else{gamePieceBorder.speedX=gamePieceRed.speedX=0；}
如果（this.keys[38]）{gamePieceBorder.speedY=gamePieceRed.speedY=-2；}
else如果（this.keys[40]）{gamePieceBorder.speedY=gamePieceRed.speedY=2；}
else{gamePieceBorder.speedY=gamePieceRed.speedY=0；}
}
}
}
//-----------------------------------------
//-----------------------------------------游戏组件
功能组件（宽度、高度、颜色、x、y）
{
这个。宽度=宽度；
高度=高度；
这个.x=x；
这个。y=y；
这是0.speedX=0；
该值为0；
this.update=函数（）
{
ctx=gameArea.context；
ctx.fillStyle=颜色；
ctx.fillRect（this.x，this.y，this.width，this.height）
}
this.move=函数（）
{
this.x+=this.speedX；
this.y+=this.speedY；
}
this.crashGame=函数（obj）
{
var left=这个.x；
var right=此.x+（此.width）；
var top=这个.y；
var bottom=此.y+（此.height）；
var otherLeft=obj.x；
var otherRight=obj.x+（obj.width）；
var otherTop=对象y；
var otherBottom=对象y+（对象高度）；
var-crash=true；
如果（底部<其他顶部| |顶部>其他底部| |右侧<其他左侧| |左侧>其他右侧）
{
崩溃=错误；
}
返回碰撞；
}
}
//-----------------------------------------
//-----------------------------------------游戏区更新程序
函数gameUpdate（）
{
if（gamePieceBorder.crashGame（障碍物）| | gamePieceRed.crashGame（障碍物））
{
gameArea.stop（）；
}
其他的
{
gameArea.clear（）；
障碍。更新（）；
gameArea.keyboard（）；
gamePieceBorder.move（）；
gamePieceBorder.update（）；
gamePieceRed.move（）；
gamePieceRed.update（）；
}
}
//-----------------------------------------
帆布
{
边框：1px实心#D3；
背景图像：url（“https://ak0.picdn.net/shutterstock/videos/22492090/thumb/1.jpg");
}
debugger