Question

A部分：

var interval = setInterval(function(){
  doSomething();
  if(...)
    clearInterval(interval);
}, 100);

B部分：

var interval = setInterval(function(){
  if(...)
    clearInterval(interval);
  doSomething();
}, 100);

有什么区别吗？

Answer 1

虽然在您的特定示例中我认为这并不成立，但值得指出的是，如果您的函数是异步的，这两个将会不同。

下面，我模拟了doSomething()耗时500毫秒：

function sleep(ms) { return new Promise(resolve => setTimeout(resolve, ms)); } async function doSomething() { console.log("Hello world"); await sleep(500); } var interval = setInterval(async function(){ await doSomething(); clearInterval(interval); }, 100);

function sleep(ms) { return new Promise(resolve => setTimeout(resolve, ms)); } async function doSomething() { console.log("Hello world"); await sleep(500); } var interval = setInterval(async function(){ clearInterval(interval); await doSomething(); }, 100);

Answer 2

在Chrome浏览器中，没什么区别。

我什至在等待1200毫秒，但您好，控制台仅记录一次。

我在这里做了一个片段，以测试其他浏览器。

之所以只触发一次，是因为计时器在下一个滴答期间触发，因此即使经过了100毫秒，也无法执行另一个Set Interval，但是可以执行的时间间隔已经清除。

说完所有这些，看看所有浏览器的行为是否都如此有趣。

更新：在Edge / IE11 / Chrome和Firefox中进行测试，所有工作均相同。 IOW：函数主体之前或之后的clearInterval没有区别。

var i = setInterval(function () {
  var t = new Date().getTime();
  while (new Date().getTime() - t < 1200) ;
  console.log("hello");
  clearInterval(i);
}, 100);

何时调用clearInterval有什么不同？

2 个答案: