使用 javascript 计划执行答案

【问题标题】：Scheduled execution with javascript使用 javascript 计划执行
【发布时间】：2016-05-30 11:14:08
【问题描述】：

我有一个以毫秒为单位的 JavaScript 函数数组和延迟：

var events = [
  {event: function_1, delay: 1234},
  {event: function_2, delay: 2456},
  ...
  {event: function_n, delay: 13154}
]

还有一个影片剪辑。这个想法是在电影播放时按照延迟参数给出的顺序执行函数。一种方法是：

video.play();
for ( var i = 0; i < events.length; i++ ) {
  setTimeout(events[i].event(), events[i].delay);
}

有没有更好的方法来保证准确的时间？

【问题讨论】：

您可以查看requestAnimationFrames。如果间隔是固定的，你甚至可以试试setInterval。像这样的东西：function initTimer(){ var count = 0; selInterval(function(){ events[count].event}, delay) }
只需通过setInterval使用一个计时器
我投票结束这个问题作为离题，因为它要求更好的编码方式。这听起来像是 codereview.stackexchange.com 的工作
您需要它们按顺序执行吗？当第一个执行时，第二个应该开始？
是的，第二个应该在达到延迟时开始。

标签： javascript scheduled-tasks settimeout

【解决方案1】：

要按顺序评估事件，您需要在每个事件之后调用回调函数。在回调中，你触发下一个事件。

events.shift() 从列表中删除第一个事件。在所有正在执行的事件结束时，事件列表将保持为空。

var events = [
  { event: function_1, delay: 1000 },
  { event: function_2, delay: 2000 },
  { event: function_n, delay: 10100 }
];

function triggerEvents(events) {
    if(events.length === 0) {
        // all events completed
        return;
    }

    // get the first event from list
    var event = events.shift();    

    setTimeout(function () {
        event.event(function () {
            startEvents(events);
        });
    }, event.delay);
};

【讨论】：

【解决方案2】：

您可以使用setTimeout 进行递归。

注意：我假设延迟以固定方式增加。

var refresh_count = 0;
var delay = 1000;
var events = [
  { event: notify.bind(this, "test") }, 
  { event: notify.bind(this, "foo") }, 
  { event: notify.bind(this, "Hello World")}];

function notify(str) {
  console.log(str);
}

function initTimeout() {
  setTimeout(function() {
    if (events[refresh_count]) {
      events[refresh_count++].event();
      initTimeout();
    }
  }, delay + (refresh_count * 1000));
}

initTimeout();

【讨论】：