setTimeout() 只运行一次，当被多次调用时

Posted 2023-02-16

【中文标题】setTimeout() 只运行一次，当被多次调用时

【英文标题】：setTimeout() only running once, when called multiple times

【发布时间】：2021-03-04 12:42:28

【问题描述】：

所以，我想要完成的是一个伤害系统，所以当敌人靠近玩家（玩家在屏幕上的位置）时，他们会受到伤害。但是，由于屏幕上同时有多个敌人，我不希望玩家被堆叠 10 层轰炸并立即死亡。所以这是我的解决方案。

createjs.Ticker.addEventListener("tick", damage1);

function drop() 
    if (eX > p1.x - 40 && eX < p1.x + 40) 
        health -= 1;
        console.log("Health is: " + health);
    


function damage1() 
    for (x = 0; x < enemy.length; x++) 
        eX = enemy[x].x;
        eY = enemy[x].y;
        if (eY > p1.y - 25 && eY < p1.y + 25) 
            setTimeout(drop, 2000);
        
    

然而，这并没有按我的预期工作。我想会发生的是，如果 if 语句通过，它将设置超时，等待 2 秒，然后到达它带走健康的函数。然而实际发生的是它到达超时，等待 2 秒，然后在每个滴答声中运行一次外卖健康命令，所以它只等待一次。

我正在使用 adobe animate、html5 画布（如果有任何改变）

【参考方案1】：

setTimeout 函数基本上同时被调用，但被调用了enemy.length 次，因为 for 循环的每次迭代都不会等待 setTimeout 回调完成。如果将console.log 添加到drop 函数中，您会看到它被多次调用。如果您希望在 for 循环中为每个索引添加延迟，您可以更改为：

setTimeout(drop, 2000 * (x + 1))

【讨论】：

所以我尝试了您在其中发布的代码，但同样的问题仍然发生，而不是等待它只是在等待第一次超时后耗尽健康

我不关注。试试下面的代码：const start = new Date().getTime(); for (let i =0; i < 10; i++) setTimeout(function () console.log('hello ' + (new Date().getTime() - start) / 1000); , 2000 * (i + 1)) 。您应该看到，每次调用回调方法之间都有 2 秒的延迟

所以我将它直接复制粘贴到带有刻度的函数中，它做同样的事情但是，当我把它放在函数之外时，它会按预期工作

【参考方案2】：

即使有适当的延迟，遍历敌人的长度仍然会带走相同数量的生命值，只是有，是的..延迟。

我会做的是取走生命值，禁用命中检测，然后设置一个计时器，在此期间玩家无懈可击。这样，玩家一次只受到一击，就有时间逃跑。

【讨论】：

听起来确实可以，我早上试试，谢谢！