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

选项A:

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

myTimeoutFunction();

选项B:

function myTimeoutFunction()
{
    doStuff();
}

myTimeoutFunction();
setInterval(myTimeoutFunction, 1000);

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


当前回答

从另一个角度来看:setInterval确保代码在每个给定的时间间隔(即1000毫秒,或您指定的时间间隔)运行,而setTimeout设置它“等待”直到运行代码的时间。而且,由于运行代码需要额外的毫秒,所以它总共需要1000毫秒,因此setTimeout会以不精确的时间(超过1000毫秒)再次运行。

例如,计时器/倒计时不是用setTimeout完成的,而是用setInterval完成的,以确保它不会延迟,并且代码以精确的给定间隔运行。

其他回答

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

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

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

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

控制台的区别很明显:

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

您的代码将具有不同的执行间隔,在某些项目中,例如在线游戏,这是不可接受的。首先,您应该怎么做,以使代码在相同的整数下工作,您应该将“myTimeoutFunction”更改为:

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

此更改后,它将等于

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

但是,您仍然不会得到稳定的结果,因为JS是单线程的。目前,如果JS线程将忙于某些事情,它将无法执行回调函数,并且执行将延迟2-3毫秒。您是否每秒执行60次,并且每次您有1-3秒的随机延迟,这是绝对不可接受的(一分钟后,大约会有7200毫秒的延迟),我可以建议您使用类似的方法:

    function Timer(clb, timeout) {
        this.clb = clb;
        this.timeout = timeout;
        this.stopTimeout = null;
        this.precision = -1;
    }

    Timer.prototype.start = function() {
        var me = this;
        var now = new Date();
        if(me.precision === -1) {
            me.precision = now.getTime();
        }
        me.stopTimeout = setTimeout(function(){
            me.start()
        }, me.precision - now.getTime() + me.timeout);
        me.precision += me.timeout;
        me.clb();
    };

    Timer.prototype.stop = function() {
        clearTimeout(this.stopTimeout);
        this.precision = -1;
    };

    function myTimeoutFunction()
    {
        doStuff();
    }

    var timer = new Timer(myTimeoutFunction, 1000);
    timer.start();

此代码将保证稳定的执行周期。即使线程也会很忙,您的代码将在1005毫秒后执行,下次它将有995毫秒的超时,结果将是稳定的。

如果您想取消超时,我发现setTimeout方法更容易使用:

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

myTimeoutFunction();

此外,如果函数中出现错误,它将在第一次错误时停止重复,而不是每秒重复错误。