Javascript 不确定为什么我的变量是'；行不通

我以前使用过变量“ballX”和“ballY”。然而，我一定是在什么地方搞砸了，因为当我尝试使用console.log查看它们的值时，它们现在显示为“未定义”。我已经花了2-3个小时浏览了我的代码并在网上进行了修复，但没有任何效果，如果有任何帮助，我将不胜感激。（这是我第一次使用javascript，因此如果是简单的问题，请提前道歉：）

//呼叫技术人员
var帆布；
var canvasContext；
canvas=document.getElementById（'gameCanvas'）；
canvasContext=canvas.getContext（'2d'）；
//初始值
var ballX=（画布宽度-20）/2；
var ballY=（画布高度-20）/2；
var yDirection=2；
var xDirection=2；
变位；
var drawerythingcount=0；
//常数
var-ballSize=20；
高度=100；
宽度=10；
window.onload=函数（）{
//调用主绘图函数，并将重复间隔设置为10毫秒
setInterval（function（）{drawerverything（PositionY）}，10）；
}
//为mousemove添加事件以记录鼠标的Y位置
document.addEventListener（“mousemove”，函数（事件）{
PositionY=（event.clientY-（panelHeight/2））；
});
功能抽屉（位置Y）{
DrawerythingCount=DrawerythingCount+1；
//绘制画布、球和面板
canvasContext.fillStyle='black'；
canvasContext.fillRect（0,0，canvas.width，canvas.height）；
canvasContext.fillStyle='red'；
canvasContext.fillRect（ballX，ballY，ballSize，ballSize）；
canvasContext.fillStyle='green'；
canvasContext.fillRect（canvas.width-panelWidth，PositionY，panelWidth，panelHeight）；
//如果球离开画布右侧，则重置游戏
如果（球>画布宽度）{
警报（'你得分：'+（XDDirection-2）+'！'）
var ballX=（canvas.width-20）/2；
var ballY=（画布高度-20）/2；
var yDirection=2；
var xDirection=2；
} 
//检查球是否即将击中左侧墙
如果（ballX-xDirection<0）{（xDirection=（xDirection*-1）+1；ballX=0；}；
//检查球是否即将离开画布的y轴并更改其位置
//方向
如果（（巴利+20）>canvas.height | |巴利<0）{
如果（（ballY+20）>canvas.height）{yddirection=-1；}否则{yddirection=1；}
}
//检查球是否击中面板
如果（（ballX+xDirection）>（canvas.width-10））{
变量y
对于（y=位置y；y<（位置y+101）；y++）{
如果（y==ballY）{xDirection=xDirection*-1；break；}
}};
//球的运动
贝利=贝利+Y方向；
ballX=ballX+X方向；
}

在您的

语句中，如果（ballX>canvas.width）

重新声明了变量，这就是问题所在。这将把变量提升到函数

drawerything

的顶部，并将您在顶部范围中声明的变量隐藏起来。在您的情况下，它将被声明为

未定义

如果删除变量前面的

var

关键字，它将按预期工作，因为您将依赖于变量的全局状态

if (ballX > canvas.width) {
    alert('You scored:' + (xDirection - 2) + '!')
    ballX = (canvas.width - 20)/2;
    ballY = (canvas.height-20)/2;
    yDirection = 2;
    xDirection = 2; 

}

这是JavaScript提供的全局状态的易用性所固有的问题。不过，您可以在将来使用一些技巧来缓解这些问题。在这里使用和关键字会给你带来巨大的帮助

---

你想在哪里输入console.log值？我在函数drawerything的开头使用了console.log，这样我就可以查看球的变化了。然而，它显示了正确的起始坐标，而其他坐标是“未定义的”