javascript - 基于时间的函数队列

Question

我想要实现函数队列，它应该根据传入的时间延迟来执行。如果队列中的任何函数在延迟之前被调用，则队列不得执行该函数，而应移至队列中的下一个函数。

例如:

function funQueue(message,date){

  //logic
}

var fn1=funQueue("message1",new Date().getTime()+500)
var fn2=funQueue("message2",new Date().getTime()+1000)
var fn3=funQueue("message3",new Date().getTime()+2000)
    fn2()

当像上面那样执行时，它应该打印。

消息1

消息3

请注意message2未打印。

谢谢大家，

Answer 1

也许有点像下面这样，使用 setTimeout()和 clearTimeout() :

function funQueue(message,date){
  var timeoutId = setTimeout(function() {  // schedule a timeout
    console.log(message)                   // that logs the message
  }, date - new Date().getTime())          // at the specified time
  
  return function() {                      // return a function
    clearTimeout(timeoutId)                // that cancels the timeout
  }
}

var fn1=funQueue("message1",new Date().getTime()+500)
var fn2=funQueue("message2",new Date().getTime()+1000)
var fn3=funQueue("message3",new Date().getTime()+2000)
fn2()

请注意，如果您使用过去的时间调用 funQueue()，它仍然会调用 setTimeout()，这意味着消息将在之后立即记录除非在当前代码中取消当前代码，否则当前代码将完成。

编辑:有人在评论中要求我在没有多个同时超时的情况下实现它。以下是我想到的第一个方法。我确信这可以以更好的方式进行整理、优化和/或完全重写，但它在我第一次单击“运行”时起作用，所以我认为这是一个足够好的起点。我将把它如何工作的解释留给读者作为练习......

var funQueue = function() {
  var queue = []
  var timeoutId
  function setNext() {
    clearTimeout(timeoutId)
    if (queue.length > 0) {
      timeoutId = setTimeout(function() {
        console.log(queue.shift().message)
        setNext()
      }, queue[0].date - new Date().getTime())
    }
  }  
  return function(message,date){
    var item = { message: message, date: date }
    var i = 0
    while (i < queue.length && date >= queue[i].date) i++
    queue.splice(i, 0, item)
    setNext()
    return function() {  
      var i = queue.indexOf(item)
      if (i != -1) {
        queue.splice(i, 1)
        setNext()
      }
    }
  }
}()

var fn1=funQueue("message1",new Date().getTime()+500)
var fn2=funQueue("message2",new Date().getTime()+1000)
var fn3=funQueue("message3",new Date().getTime()+2000)
var fn4=funQueue("message4",new Date().getTime()+1500)
var fn5=funQueue("message5",new Date().getTime()+2000)
fn2()