javascript - 创建一个在 Javascript 中循环的精确毫秒计时器

Question

经过一些研究，我了解到在 Javascript 中创建计时器的最准确方法是使用 date.now() -as this answer 比较从起点开始所耗时。建议。

var startTime = Date.now();

var interval = setInterval(function() {
  var elapsedTime = Date.now() - startTime;
  var time = (elapsedTime / 1000).toFixed(3);
  console.log(time);
}, 10);

这提供了我正在寻找的准确性，但我希望让这个计时器在达到某个值后自行重置(假设var Total = 12000)。该值由视频播放列表的长度决定(我正在为视频程序构建“实时”播放头)，并且是一个变量。

我不知道如何解决这个问题，因为计数器正在计算从某个时间点开始耗时，它不太符合我正在寻找的逻辑。任何建议，将不胜感激。

Answer 1

您可以使用.setTimeout()在代码末尾重新启动 .setInterval() ，在所需的时间过去后

function runInterval (loopAfter) {
  var startTime = Date.now();

  var interval = setInterval(function() {
    var elapsedTime = Date.now() - startTime;
    var time = (elapsedTime / 1000).toFixed(3);
    console.log(time);
  }, 10);
  
  setTimeout(() => {
    clearInterval(interval);
    runInterval(loopAfter);
  }, loopAfter);
}

runInterval(5000);