我试图在构造器中每秒调用一个方法,持续15秒,但setInterval似乎不起作用

I'm trying to call a method in a constructer every second for 15 seconds but setInterval doesn't seem to work

本文关键字:持续 方法 一个 15秒 不起作用 setInterval 构造器 调用      更新时间:2023-09-26

代码-也可在这里获得:

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.fillStyle = "#000000" ;
ctx.fillRect(0,0,600,600);
ctx.fillStyle ="#ffffff";
var entities = [];
var x;
var y;
function ship(x, y) {
  entities.push(entities.length-1);
  this.name = entities.length-1;
  this.draw = function(){
    ctx.fillRect(x,y,30,30);
  };
  this.update = function(){
    x+=10;
    this.draw();
  }; 
}
var bob = new ship(0,0);
bob.draw();
var intervalID = setInterval(bob.update(), 1000);
setTimeout(function() {
  clearInterval(intervalID);
}, 18000);
基本上,我在左上角画了一个正方形。然后我尝试使用一种方法来实时移动它。当我使用for循环时,我可以看到正方形移动了,但显然它移动得太快了,甚至没有注意到。

你需要传递一个绑定引用给bob.update

var intervalID = setInterval(bob.update.bind(bob), 1000);

将index.html第48行改为

 var intervalID = setInterval(function(){bob.update()}, 1000);

你应该很好

我没有运行代码,但这看起来是你的问题

setInterval(bob.update(), 1000)

setInterval的第一个参数需要是一个函数对象——在本例中是船舶对象的update函数。

在上面的声明中,你实际上是调用 update函数,所以传递给setInterval的不是update函数本身,而是调用它的返回值-这是未定义 -所以你的setInterval做…没有,每一秒。

你需要将更新函数"绑定"到bob对象,这样this的值在每次实际调用时都是bob对象的this

将其更改为这样,即传递绑定到bob对象的update函数,并尝试再次运行

setInterval(bob.update.bind(bob), 1000)