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

选项A:

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

myTimeoutFunction();

选项B:

function myTimeoutFunction()
{
    doStuff();
}

myTimeoutFunction();
setInterval(myTimeoutFunction, 1000);

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


当前回答

我对setInterval(func,milisec)进行了简单的测试,因为我很好奇当函数时间消耗大于间隔持续时间时会发生什么。

setInterval通常会在上一次迭代开始之后安排下一次迭代,除非函数仍在运行。如果是,setInterval将等待,直到函数结束。一旦发生,函数就会立即再次启动——不需要根据计划等待下一次迭代(因为在没有时间超过函数的情况下)。并行迭代也没有运行的情况。

我已经在Chrome v23上测试过了。我希望它在所有现代浏览器中都是确定性的实现。

window.setInterval(function(start) {
    console.log('fired: ' + (new Date().getTime() - start));
    wait();
  }, 1000, new Date().getTime());

控制台输出:

fired: 1000    + ~2500 ajax call -.
fired: 3522    <------------------'
fired: 6032
fired: 8540
fired: 11048

wait函数只是一个线程阻塞助手-同步ajax调用,在服务器端需要2500毫秒的处理时间:

function wait() {
    $.ajax({
        url: "...",
        async: false
    });
}

其他回答

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

当您运行以下javascript或检查此JSFiddle时,您可以自己验证bobcen答案

<div id="timeout"></div>
<div id="interval"></div>

var timeout = 0;
var interval = 0;

function doTimeout(){
    $('#timeout').html(timeout);
    timeout++;
    setTimeout(doTimeout, 1);
}

function doInterval(){
    $('#interval').html(interval);
    interval++;
}

$(function(){
    doTimeout();
    doInterval();
    setInterval(doInterval, 1);
});

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

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

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

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

我使用setTimeout。

显然,区别在于setTimeout只调用一次方法,setInterval则重复调用它。

这是一篇很好的文章,解释了两者的区别:教程:带有setTimeout和setInterval的JavaScript计时器

我对setInterval(func,milisec)进行了简单的测试,因为我很好奇当函数时间消耗大于间隔持续时间时会发生什么。

setInterval通常会在上一次迭代开始之后安排下一次迭代,除非函数仍在运行。如果是,setInterval将等待,直到函数结束。一旦发生,函数就会立即再次启动——不需要根据计划等待下一次迭代(因为在没有时间超过函数的情况下)。并行迭代也没有运行的情况。

我已经在Chrome v23上测试过了。我希望它在所有现代浏览器中都是确定性的实现。

window.setInterval(function(start) {
    console.log('fired: ' + (new Date().getTime() - start));
    wait();
  }, 1000, new Date().getTime());

控制台输出:

fired: 1000    + ~2500 ajax call -.
fired: 3522    <------------------'
fired: 6032
fired: 8540
fired: 11048

wait函数只是一个线程阻塞助手-同步ajax调用,在服务器端需要2500毫秒的处理时间:

function wait() {
    $.ajax({
        url: "...",
        async: false
    });
}