Javascript 每个对象实例的唯一setInterval值

我有3个对象“球”的实例，它们以1像素的速率向右移动。同时，我希望它们以不同的速度移动——每个都有一个唯一的设置间隔值

最初，我将它们设置为以不同的像素速率向右移动，但这使得碰撞检测（在另一个项目中使用时）有点不可靠。这是我的密码：

$(window).load(function() {

balls = [];
FPS = 1000/60;

function Speed(ballSpeed) {

    this.ballSpeed = ballSpeed;
}

function Ball() {
    var rNum = Math.random() + 1;   
    var rate = Math.round(rNum*10)/10;
    var ballDrop = $('<div />').addClass('ball');
    this.speed = new Speed(rate);
    this.output = ballDrop.appendTo($(".container"));   
}

Ball.prototype = {
    updatePos: function() {             
        bL = this.output.position().left;
        this.output.css({left: bL += 1});   
        this.output.text(this.speed.ballSpeed); 
    }

}

var ballRate = setInterval(function() {
    balls.forEach(function(ball){
        ball.updatePos();   
        if (bL === 580) {
        window.clearInterval(ballRate);
        }           
    });

}, FPS);

function addBall() {
    ball = new Ball(10, 20);
    balls.push(ball);
    }

for (var i=0; i<3; i++) {
    addBall();
    }

});

---

以下是

因此，存在一些问题：如果用显示的第二个变量替换setInterval代码，则必须将其移动到球实例化下方的。（因为循环只执行一次，如果球没有实例化，代码就不会运行，因为没有球可以迭代

此外，bL变量在所有球之间共享，因此为了获得不同的速度，必须将bL更改为this.bL和ball.bL

最后但并非最不重要的一点是，球速差异太小，无法看到。（你如何区分每秒1000次和每秒999次？），因此我建议你将设置间隔中的ball.speed.ballSpeed更改为FPS*ball.speed.ballSpeed

此外，Ball构造函数的参数似乎未使用，因此我建议删除这些参数

Code to let me add jsFiddle link

JSfiddle工作示例：

---

希望我能帮上忙，费迪265你需要实际使用每个球的个人速度

下面是代码的更新

Ball.prototype = {
    updatePos: function() {             
        bL = this.output.position().left;
        if(bL < 580) {
            this.output.css({left: bL += this.speed.ballSpeed});    
            this.output.text(this.speed.ballSpeed);
            return true;
        }else {
            return false;
        }
    }   
}

---

停止计时是因为球的速度不同，所以当最后一个球穿过终点时，间隔需要停止。

1像素/什么？不要在动画帧中测量时间！你的问题到底是什么？你应该为ball类定义一些

run

方法，调用它开始运行球，当然是每个run方法应该调用核心

setInterval

，间隔时间应该不同（特别是每个球），就像这样，三个球都用bL，那是不会的work@Alex

bL

只是用来知道在哪里停球。当然他用错了，所以球永远不停地跑。但他的问题不是这一部分。他希望每个球都有单独的

setInterval

。非常感谢！这是一个很大的帮助。

Ball.prototype = {
    updatePos: function() {             
        bL = this.output.position().left;
        if(bL < 580) {
            this.output.css({left: bL += this.speed.ballSpeed});    
            this.output.text(this.speed.ballSpeed);
            return true;
        }else {
            return false;
        }
    }   
}

var ballRate = setInterval(function() {
    var keepUpdating = [];
    balls.forEach(function(ball){
        keepUpdating.push(ball.updatePos());                
    });
    if(keepUpdating.indexOf(true) === -1) {
        window.clearInterval(ballRate);
    }
}, FPS);