如何在无限循环中执行3秒后执行代码

Question

我正在使用HTML帆布进行游戏，我想在其中每次都在动画循环中检查某些条件，如果该条件变为真实，那么我不想检查接下来的3秒钟，并且3秒钟后，我想再次检查。像

function animate(){
  requestAnimationFrame(animate)
  if (checking something){
    if this if statement gets executed then don't check this if statement for next 3 seconds 
  }

这听起来有些混乱，但无论如何都可以做到这一点。

Answer 1

我的建议是添加一个标志 - 您可以用来检查是否应该完成操作的另一个变量，以及在一定时间之后切换标志的另一个功能。

// THE CHECKING FLAG
let shouldCheckCondition = true;

function animate(){
  requestAnimationFrame(animate)
  
  // CHECK THE FLAG FIRST, IF SHOULD NOT CHECK, EXIT THE FUNCTION
  if (!shouldCheckCondition) return;

  if (condition){
    // DISABLE THE CHECKING FLAG SO YOU SKIP THE SUBSEQUENT CHECKS
    shouldCheckCondition = false;

    // DO SOMETHING WHEN CONDITION IS MET AND CHECKING SHOULD BE DONE

    // ENABLE THE CHECKING FLAG AFTER 3 second
    setTimeout(() => { shouldCheckCondition = true; }, 3000);
  }

Answer 2

如果您想在另一种方法中内联行动，SetInterval可能无济于事。

您只需记下您上次进行检查（例如，以毫秒为单位的系统时间），然后确保下一次进行检查后的检查时间超过3000ms。

date.valueOf(); //An existing date object to milliseconds format
(new Date()).valueOf(); //current time in ms

您可以有两个var s lastcheckedtime和currenttime。

Answer 3

requestAnimationFrame尝试在下一个帧上运行，而不是三秒钟后。因此，如果要三秒钟，请不要使用requestAnimationFrame。

function animate(){
    if (checking something){
        setTimeout(animate, 3000);
    } else {
        requestAnimationFrame(animate);
    }
}