Javascript 重复设置超时

我试图每10秒重复一次

setTimeout

。我知道默认情况下，

setTimeout

只等待一次，然后执行一次操作。我如何重复这个过程

setTimeout(function() {
  setTimeout(function() {
    console.log("10 seconds");
  }, 10000);
}, 10000);

也许您应该使用

setInterval（）

可能就是您想要的，但是如果您想使用

setTimeout（）

获得相同的效果：

或者，如果您不想声明一个单独的函数，并且希望坚持使用函数表达式，则需要将其设置为命名函数表达式：

setTimeout(function doSomething() {
    console.log("10 seconds");
    setTimeout(doSomething, 10000);
}, 10000);

---

（如果您不介意使用不推荐的语言功能，也可以使用。）

与@nnnnnn和@uzyn提供的答案不同，我不鼓励您使用

setInterval

，原因如下所述。而是使用以下增量计时脚本：

function DeltaTimer(render, interval) {
    var timeout;
    var lastTime;

    this.start = start;
    this.stop = stop;

    function start() {
        timeout = setTimeout(loop, 0);
        lastTime = + new Date;
        return lastTime;
    }

    function stop() {
        clearTimeout(timeout);
        return lastTime;
    }

    function loop() {
        var thisTime = + new Date;
        var deltaTime = thisTime - lastTime;
        var delay = Math.max(interval - deltaTime, 0);
        timeout = setTimeout(loop, delay);
        lastTime = thisTime + delay;
        render(thisTime);
    }
}

上面的脚本运行给定的

渲染

函数，尽可能接近指定的

间隔

，为了回答您的问题，它使用

设置超时

重复一个过程。在您的情况下，您可以执行以下操作：

var timer = new DeltaTimer(function (time) {
    console.log("10 seconds");
}, 10000);

var start = timer.start();

---

在我看来，setInterval（）是您的最佳选择。
下面是一些代码：

 setInterval(function() {

//your code

}, 10000); 
// you can change your delay by changing this value "10000".

---

下面是一个使用setTimeout的函数，它试图调用自己，使其尽可能接近一个常规间隔。如果观察输出，可以看到时间漂移和重置

<script type="text/javascript">

function Timer(fn, interval) {
  this.fn = fn;
  this.interval = interval;
}

Timer.prototype.run = function() {

    var timer = this;
    var timeDiff = this.interval;
    var now = new Date();  // Date.now is not supported by IE 8
    var newInterval;

    // Only run if all is good
    if (typeof timer.interval != 'undefined' && timer.fn) {

      // Don't do this on the first run
      if (timer.lastTime) {
        timeDiff = now - timer.lastTime;
      }
      timer.lastTime = now;

      // Adjust the interval
      newInterval = 2 * timer.interval - timeDiff;

      // Do it
      timer.fn();

      // Call function again, setting its this correctly
      timer.timeout = setTimeout(function(){timer.run()}, newInterval);
  }
}


var t = new Timer(function() {
  var d = new Date();
  document.getElementById('msg').innerHTML = d + ' : ' + d.getMilliseconds();
}, 1000);


window.onload = function() {
  t.run();
};
</script>

<span id="msg"></span>

功能计时器（fn，间隔）{
这个.fn=fn；
这个。间隔=间隔；
}
Timer.prototype.run=函数（）{
var定时器=此；
var timeDiff=此时间间隔；
var now=new Date（）；//IE 8不支持Date.now
var新区间；
//只有在一切都好的情况下才跑步
if（typeof timer.interval！=“未定义”&&timer.fn）{
//第一次跑步时不要这样做
如果（计时器上次时间）{
timeDiff=now-timer.lastTime；
}
timer.lastTime=现在；
//调整间隔
newInterval=2*timer.interval-timeDiff；
//做吧
timer.fn（）；
//再次调用函数，将其设置为正确
timer.timeout=setTimeout（函数（）{timer.run（）}，newInterval）；
}
}
var t=新计时器（函数（）{
var d=新日期（）；
document.getElementById（'msg'）.innerHTML=d+'：'+d.getMillimes（）；
}, 1000);
window.onload=函数（）{
t、 run（）；
};

使用jQuery，您可以这样做：

函数更新页（）{
var interval=setTimeout（updatePage，10000）；//10'秒
$（'a[href]'）。单击（函数（）{
$（此）.data（'clicked'，true）；
clearInterval（interval）；//单击任何href链接时清除
console.log（'Interval Cleared！'）；
});
//替换您要执行的“您的函数\u名称”函数
setTimeout（你的函数名，500）；
}//函数updatePage关闭语法
updatePage（）；//再次调用该函数。

---

最简单，但不是有效的方法

一些可能有用的附加文档：哈哈，好的，谢谢。我没有意识到setinterval和SetTimeOut都有延迟。你甚至没有提供替代方案。需要使用重复的

setTimeout

而不是

setInterval

。您只说了明显的，这很好，因为有时它并不明显，但没有提供原始问题的实际答案。不要使用

参数。被调用方

会降低性能，只需命名您的函数并使用该名称即可。当然，它在IE中不起作用，但我认为这是一个很好的折衷办法。@AaditMShah“在IE中不起作用”是什么意思？命名函数表达式（甚至有缺陷），但它们肯定“有效”。@AaditMShah-我同意RobG的观点。但是假设如果它在IE中根本不起作用，那么忽略一个拥有巨大市场份额的浏览器怎么会是一个“好的妥协”？无论如何，您可以看到我只是在事后才提到了

参数。被调用方

：我包含它主要是为了链接到它上面讨论递归函数表达式的MDN页面。你真的认为你提到的性能降低与10秒的延迟有关吗？或者在任何基于超时的算法中，它根本不是递归吗？@nnnnnn-它与递归无关。使用

arguments.callee

会使解释器很难内联函数。在这种情况下，它当然不会产生巨大的影响，但在关键的地方（比如在以60 fps的速度运行的游戏循环中），它肯定会导致延迟。除了命名函数表达式外，它看起来更干净，我不太喜欢旧版本的IE。它们甚至不能运行HTML5游戏。新版本终于开始符合标准了。你的函数并没有按照你的想法去做<代码>循环在第一次调用后以零间隔被调用。@RobG-我不同意。当您调用

start

时，它首先以

0

ms的延迟调用循环。但是浏览器通常指定

4

ms的最小延迟。之后，它会调整延迟，以便始终以固定的时间间隔调用它。你不必相信我的话。请参阅下面的日志，其中记录了与计时器每秒启动时间的时差。将代码复制并粘贴到IE 8（并将

Date.替换为
new Date（）
，因为非ES5浏览器不支持它）会导致函数在第一次调用后立即运行，而不会等待。确定，发现了问题。在IE 8中，除了将
Date.now
替换为
new Date（）
之外，还需要
lastTime=new Date（thisTime.getTime（）+延迟）因为答案中的那行结果为
NaN
。顺便说一句，这些更改也应该适用于其他浏览器。你需要进行更广泛的测试。否则，您的答案是好的。@RobG-我可以这样做，或者我可以搜索所有
Date.now（）
并将其替换为
+new Date
。这两个都是相同的。这个问题可能是相关的：注意，这会将函数体调度为在c的10000milis延迟后执行
<script type="text/javascript">

function Timer(fn, interval) {
  this.fn = fn;
  this.interval = interval;
}

Timer.prototype.run = function() {

    var timer = this;
    var timeDiff = this.interval;
    var now = new Date();  // Date.now is not supported by IE 8
    var newInterval;

    // Only run if all is good
    if (typeof timer.interval != 'undefined' && timer.fn) {

      // Don't do this on the first run
      if (timer.lastTime) {
        timeDiff = now - timer.lastTime;
      }
      timer.lastTime = now;

      // Adjust the interval
      newInterval = 2 * timer.interval - timeDiff;

      // Do it
      timer.fn();

      // Call function again, setting its this correctly
      timer.timeout = setTimeout(function(){timer.run()}, newInterval);
  }
}


var t = new Timer(function() {
  var d = new Date();
  document.getElementById('msg').innerHTML = d + ' : ' + d.getMilliseconds();
}, 1000);


window.onload = function() {
  t.run();
};
</script>

<span id="msg"></span>

const myFunction = () => {
        setTimeout(() => {
            document.getElementById('demo').innerHTML = Date();
            myFunction();
        }, 10000);
    }