Question

我的页面上有两个函数需要定期调用，但只能以某种方式调用。

function_a需要在页面加载时定期运行，直到数据可用并下载。

在此之后，function_b需要定期运行。

我可以很容易地做到......

setInterval(function_a, 1000);
setInterval(function_b, 5000);

但是这将从页面加载开始并永远运行这两个函数。

一旦我确定不再需要function_a运行，我怎么能停止运行，并且只在这一点之后启动function_b运行？

我可以将检查放在function_a和function_b代码中，这样如果不需要它们就不会执行，但是在不需要时仍然不断地调用它们似乎非常浪费。

function_a(){
 if (needed) { code here... }
}

function_b(){
 if (needed) { code here... }
}

必须有比这更好的方法吗？

Answer 1

您可以将变量分配给setInterval()来电并使用clearInterval()

let a = setInterval(function_a, 1000);

function_b() {
  if (a_is_not_needed) { clearInterval(a) }
}

Answer 2

使用clearInterval()停止在setInterval()

中调用的函数

var needed = false;

var f1 = function(){ 
    console.log("Fct1"); 
    if(needed){
        setInterval(f2, 5000); // start f2 when f1 is finish
        clearInterval(interval); // stop to call periodically f1
    }
}   
var f2 = function(){ 
    console.log("Fct2"); 
}

var interval = setInterval(f1, 1000);

试试这个fiddle并打开控制台查看结果

Answer 3

而不是setInterval，setTimeout可以更好地运作。

function a() {
  //do stuff

  if(condition) setTimeout(b, 5000)
  else setTimeout(a, 1000)
}

function b(){
  //do stuff

  setTimeout(b, 5000)
}

a()

这样，该函数将执行并安排自己在所需的时间间隔内再次运行。这类似于requestAnimationFrame用于创建动画的方式。

在javascript中定期调用函数直到完成，然后开始调用不同的函数

3 个答案: