如何停止setTimeout递归

Question

我创建了一个setTimeout，它有一个名为run的回调，在运行中我调用console.log(i)用i++打印I的值，一旦达到50，我想用clearTimeout清除setTimeout ，我再次运行setTimeout并使其递归运行，但是它不起作用。 有人可以帮助我更好地理解这个概念吗？

let i = 1;

var abc = setTimeout(function run(){
   console.log(i);
if(i==50){
    abc1();
  }  
  i++;
  setTimeout(run,100);
},100);
function abc1(){
     clearTimeout(abc);
}

Answer 1

调用setTimeout您将获得返回的计时器的ID。 这正是您在这里所做的：

var abc = setTimeout(function run(){

但是，该ID仅在执行延迟功能之前才有效。 一旦这样做，它是无效的。 当您调用setTimeout(run,100); 您将获得计时器的新 ID。 您需要再次捕获它，否则ID将会丢失，并且您将无法停止它。

最后要考虑的是-即使您要正确捕获ID，也要使用当前代码，即abc = setTimeout(run, 100); 仍然不会停止计数器，因为它将尝试停止当前正在运行的功能（不执行任何操作），而不是取消执行下一个：

let i = 1;

var abc = setTimeout(function run() {
  console.log(i);
  if (i == 50) {
    abc1(); //this will clear the *current* timer 
  } 
  i++;
  abc = setTimeout(run, 100); //this will set the *new* ID 

}, 100);

function abc1() {
  clearTimeout(abc);
}

为了停止执行，您有两个选择。 如果您想使用最初的想法，则需要在计划以后取消将来的执行

 let i = 1; var abc = setTimeout(function run() { console.log(i); abc = setTimeout(run, 100); //this will set the *new* ID if (i == 50) { abc1(); //this will clear the *new* timer now } i++; }, 100); function abc1() { clearTimeout(abc); } 

另外，您可以完全不使用计时器句柄来执行此操作，而只需使用if条件来确定是否要安排另一个执行：

 let i = 1; setTimeout(function run() { console.log(i); if (i != 50) { //until 50 is reached abc = setTimeout(run, 100); //schedule a new execution } i++; }, 100); 

Answer 2

问题是您的操作顺序。

if(i==50){
    abc1();
  } 

如果我达到50，则将调用函数abc1（）-清除间隔。

i++;
setTimeout(run,100);

在这里，您要重新启动间隔。 您需要将其包装在else块中。

 let i = 1; var abc = setTimeout(function run() { console.log(i); if (i == 50) { abc1(); } else { i++; setTimeout(run, 100); } }, 100); function abc1() { clearTimeout(abc); } 

Answer 3

let i = 1;

var abc = setTimeout(function run(){
  console.log(i);
  if(i<50){
      setTimeout(run,100);
    }  
  i++;

},100);

仅当计时器未耗尽时，才应运行超时。

Answer 4

run（）中的setTimeout（）未分配给任何变量，因此无法以任何方式清除它。

我想您要覆盖abc，所以您必须替换：

setTimeout(run,100);

通过

abc = setTimeout(run,100);

Answer 5

由于var abc仅设置一次，因此在第一次超时时，您仅清除了第一次超时，该超时很可能已经完成。

SetTimeout返回一个数字值，该数字值是引用该任务的ID。 调用clearTimeout ，必须将要清除的超时通知ID，现在您要通知第一次超时的ID，该超时已经完成，因此无法清除。

如果您希望清除上一个超时，则可能希望始终使用每个超时的ID更新abc ，如下所示：

 abc = setTimeout(run,100);

Answer 6

这是执行定时循环的一种怪异方法，但是您只需要清除（实际上，在这种情况下不是，但是我还是喜欢这样做，因为一旦您不再使用它们，则释放资源是个好习惯）通过在创建新的abc句柄之前跟踪abc句柄来完成，并在给定条件clear后返回：

 let i = 1; let abc = setTimeout( function run(){ console.log(i); if(i==50){ abc1(); return; } abc1(); i++; abc = setTimeout(run,100); }, 100 ); function abc1(){ clearTimeout(abc); } 

Answer 7

您需要在调用abc1函数后添加return。 您清除超时，但代码仍在运行，然后再次调用setTimeout（run，100）。

        let i = 1;

var abc = setTimeout(function run(){
   console.log(i);
if(i==50){
    abc1();
    return;
  }  
  i++;
  setTimeout(run,100);
},100);
function abc1(){
     clearTimeout(abc);
}