javascript clearInterval 不适用于数组函数

Question

var intervalHandles = [];

function instanceLoopTimer(url,instance, time, id) { 
 if (id in intervalHandles) {
  clearInterval(intervalHandles[id]);
  intervalHandles[id] = 0;
 }
 intervalHandles[id] = setInterval(function() { 
  myFuction(); 
 }, time);
}

我创建了这个函数，这样它就可以自己循环，这个函数在你第一次运行时工作得很好，但第二次我运行使用相同的值时，它似乎进入了一个无限循环

我认为 clearInterval 没有被触发，所以当我重新运行它进入循环的同一个实例时，有人可以帮我吗

Answer 1

您应该使用和反对 var intervalHanldes = {} 使用数组时，不能使用字符串作为索引。
如果您将 prop 设置为 0，in 运算符将找到它，因此最好使用 delete

var intervalHandles = {}; // should be an object!

function instanceLoopTimer(url,instance, time, id) { 
  if (id in intervalHandles) {
    clearInterval(intervalHandles[id]);
    delete intervalHandles[id];
  }

  intervalHandles[id] = setInterval(myFuction, time);
}

Answer 2

您的代码确实有效。如果您第二次调用该函数，它将停止原始间隔，将其设置为 0，然后将在其位置开始一个新间隔：

演示：

var intervalHandles = [];

var myFunction = function() {
  console.log('myFunction was called, 1 second interval');
};

function instanceLoopTimer(url, instance, time, id) {
  if (id in intervalHandles) {
    clearInterval(intervalHandles[id]);
    intervalHandles[id] = 0;
  }
  intervalHandles[id] = setInterval(function() {
    myFunction();
  }, time);
}

instanceLoopTimer(null, null, 1000, 1);

setTimeout(function() {
  myFunction = function() {
    console.log('new myFunction was called, 0.5 second interval');
  };

  instanceLoopTimer(null, null, 500, 1);
}, 5000);

如果您想要第二次调用完全停止间隔而不是重新启动它，您可以在 if 语句中添加 return：

演示：

var intervalHandles = [];

var myFunction = function() {
  console.log('myFunction was called, 1 second interval');
};

function instanceLoopTimer(url, instance, time, id) {
  if (id in intervalHandles) {
    clearInterval(intervalHandles[id]);
    intervalHandles[id] = 0;
    return;
  }
  intervalHandles[id] = setInterval(function() {
    myFunction();
  }, time);
}

instanceLoopTimer(null, null, 1000, 1);

setTimeout(function() {
  myFunction = function() {
    console.log('This should not be called');
  };

  instanceLoopTimer(null, null, 1000, 1);
}, 5000);

值得注意的是，如果您第三次调用它并期望间隔再次开始，它不会。这是因为您的 ID 将保留在您的 intervalHandles 数组中，除非您像这样在 return 语句上方插入 delete intervalHandles[id]：

var intervalHandles = [];

var myFunction = function() {
  console.log('myFunction was called, 1 second interval');
};

function instanceLoopTimer(url, instance, time, id) {
  if (id in intervalHandles) {
    clearInterval(intervalHandles[id]);
    delete intervalHandles[id];
    return;
  }
  intervalHandles[id] = setInterval(function() {
    myFunction();
  }, time);
}

instanceLoopTimer(null, null, 1000, 1);

setTimeout(function() {
  myFunction = function() {
    console.log('This should not be called');
  };

  instanceLoopTimer(null, null, 1000, 1);
}, 5000);

setTimeout(function() {
  myFunction = function() {
    console.log('The interval is alive again!');
  };

  instanceLoopTimer(null, null, 1000, 1);
}, 10000);

javascript clearInterval 不适用于数组函数

javascript clearInterval not working on array function

javascript

jquery

setinterval

clearinterval