Question

我正在尝试创建一个简单的JavaScript游戏，但我遇到了访问其外部函数数据的问题。

此代码完美无缺。

window.onload = function() {
var FPS = 30;
var ground = new myObject();
var twoground = new myObject();
setInterval(function() {
  clear();
  draw();
  ground.draw(0, 325);
  twoground.draw(125,325);
  alert(ground.xval);
}, 1000/FPS);
};

function myObject(){ 
this.draw = function drawground(groundx, groundy){
this.xval=groundx+125;
this.yval = groundy;
var canvas = document.getElementById('canvas')
var  context = canvas.getContext('2d');
var img=new Image()
img.src="ground.png"
img.onload = function() { 
context.drawImage(img,groundx,groundy)}

}

};

每次间隔运行时，上面都会向浏览器发出警报125，但这是我可以做到的唯一方法，例如，如果我执行以下操作。

window.onload = function() {
var FPS = 30;
var ground = new myObject();
var twoground = new myObject();
setInterval(function() {
  clear();
  draw();
  ground.draw(0, 325);
  twoground.draw(125,325);
  myalert();
}, 1000/FPS);
};

 function myalert()
{
 alert(ground.xval);
}

function myObject(){ 
this.draw = function drawground(groundx, groundy){
this.xval=groundx+125;
this.yval = groundy;
var canvas = document.getElementById('canvas')
var  context = canvas.getContext('2d');
var img=new Image()
img.src="ground.png"
img.onload = function() { 
context.drawImage(img,groundx,groundy)}

}

};

我期望的是同样的事情，因为它应该在相同的时间间隔内调用myalert，它只显示警报，但事实并非如此。我觉得我错过了javascript函数的工作方式。

Answer 1

使用var关键字在函数内声明变量时，变量将放在函数的本地范围内。要使其在函数外部可访问，您可以通过省略var关键字将其置于全局范围内。

但是，您可能还需要考虑重构代码以避免全局变量，方法是将它们作为自定义对象的属性，或者将它们作为函数参数传递。

Answer 2

JavaScript是静态范围的，不是动态范围的。当您在第二个示例中引用ground时，您指的是名称为ground的全局变量，而不是第一个示例中的局部变量ground。传递给setInterval()的函数从其父函数捕获局部变量ground，并且在评估alert()时它仍在范围内。

函数外的Javascript函数数据

2 个答案: