据我所知,这两个javascript的行为方式相同:

选项A:

function myTimeoutFunction()
{
    doStuff();
    setTimeout(myTimeoutFunction, 1000);
}

myTimeoutFunction();

选项B:

function myTimeoutFunction()
{
    doStuff();
}

myTimeoutFunction();
setInterval(myTimeoutFunction, 1000);

使用setTimeout和setInterval之间有什么区别吗?


当前回答

如果将setInterval中的间隔设置得太短,则它可能会在上一次函数调用完成之前触发。我在最近的浏览器(Firefox 78)中遇到了这个问题。这导致垃圾收集无法足够快地释放内存,并造成了巨大的内存泄漏。使用setTimeout(函数,500);给垃圾收集足够的时间来清理和保持内存稳定。

Serg Hospodarets在他的回答中提到了这个问题,我完全同意他的说法,但他没有包括内存泄漏/垃圾收集问题。我也经历了一些冻结,但对于一些微不足道的任务,内存使用量很快就达到了4GB,这对我来说真的很糟糕。因此,我认为这个答案对我这种情况下的其他人仍然有益。我本想发表评论,但缺乏这样做的声誉。我希望你不介意。

其他回答

控制台的区别很明显:

当您在setInterval中运行某个函数时,它的工作时间比超时时间长->浏览器将被卡住。-例如,doStuff()需要1500秒才能执行,您需要:setInterval(doStuff,1000);1) 浏览器运行doStuff(),需要1.5秒才能执行;2) 约1秒后,它尝试再次运行doStuff()。但之前的doStuff()仍在执行->所以浏览器将此运行添加到队列中(在第一次完成后运行)。3,4,..) 相同的添加到下一次迭代的执行队列中,但上一次的doStuff()仍在进行中。。。结果,浏览器卡住了。为了防止这种行为,最好的方法是在setTimeout内运行setTimeout以模拟setInterval。要纠正setTimeout调用之间的超时,可以使用JavaScript的setInterval技术的自我纠正替代方法。

好吧,setTimeout在一种情况下更好,正如我刚刚学到的。我总是使用setInterval,我让它在后台运行了半个多小时。当我切换回该选项卡时,幻灯片(使用代码的幻灯片)的变化非常快,而不是每5秒一次。事实上,随着我对它进行更多的测试,它确实会再次发生,这是否是浏览器的错误并不重要,因为使用setTimeout,这种情况是完全不可能的。

只是添加到已经说过的内容上,但setTimeout版本的代码也将达到最大调用堆栈大小,这将使其停止运行。因为递归函数没有停止的基本情况,所以不能让它永远运行。

他们本质上试图做同样的事情,但setInterval方法将比setTimeout方法更准确,因为setTimeout等待1000ms,运行函数,然后设置另一个超时。因此,等待时间实际上比1000毫秒多一点(如果您的函数需要很长时间才能执行,则会更长)。

虽然有人可能认为setInterval将每1000ms执行一次,但需要注意的是,setInterval也会延迟,因为JavaScript不是一种多线程语言,这意味着,如果脚本的其他部分正在运行,则该间隔必须等待它完成。

在这个Fiddle中,您可以清楚地看到超时将落后,而时间间隔几乎一直都是1次/秒(脚本正在尝试这样做)。如果将顶部的速度变量更改为20这样的小值(意味着它将尝试每秒运行50次),则间隔将永远不会达到每秒50次迭代的平均值。

延迟几乎总是可以忽略不计的,但是如果你正在编程一些非常精确的东西,你应该使用一个自动调整的计时器(它本质上是一个基于超时的计时器,它会根据创建的延迟不断调整自己)