javascript - 如何强制 setTimeout 排队的任务执行顺序为 0 延迟

Question

我需要顺序调用一些函数，为了强制框架在每个步骤后进行脏检查，我使用了 setTimeout(func,0) 来触发脏检查机制。

我知道简单地一一调用 setTimeout 并不能保证传递的异步函数会按预期顺序调用，因此我拼凑了以下解决方案:

function foo(arg){
  setTimeout(()=>console.log('executing task' + arg),0);
  console.log('on call stack' + arg);
  return foo;
}

我尝试了foo(1)(2)(3)(4)(5)，效果很好。但我不确定它总是能正常工作。

有人可以帮我吗!

<小时/>

@Steffomio 的答案绝对可以使排队任务具有确定性，它还确保每个任务都有自己的事件循环。

这是我的改编版本:

function queueTask(task) {
  var queue = [];
  function nextTask() {
    setTimeout(function () {
      queue.length && queue.shift()(); taskCount++;
      queue.length && nextTask();
    }, 0);
  }
  return (function pushTask(task) {
    queue.push(task);
    //After the first call trigger the timeout asynchrony
    if (queue.length === 1) { nextTask(); } 
    return pushTask;
  })(task);
}

//Test part below
function t(arg) { return function () { console.log('Task ' + arg); } }

var taskCount = 0;
var beginTime = Date.now();

queueTask(t(1))(t(2))(t(3))(t(4))(t(5))
  (t('a'))(t('b'))(t('c'))(t('d'))(t('e'))
  (t(1))(t(2))(t(3))(t(4))(t(5))
  (t('a'))(t('b'))(t('c'))(t('d'))(t('e'))  
  (function () { console.log(taskCount + ' tasks executed, Time elapsed: ' + (Date.now() - beginTime)); });

经过一些研究，我了解到传递给 setTimeout 的回调只有在调用堆栈被清除(上面没有更多代码)时才会被系统调用，因此排队任务的实际执行获胜直到排队完成后才开始，如果我们线性排队几个0延迟超时任务，那么当下一个事件循环开始时，它们将在一次运行中全部执行。那不是我想要的!因此，到目前为止，我知道在前面的 setTimeout 回调中调用 setTimeout 是强制逐个任务调度的唯一方法。

为了更好地理解，请引用演讲"What the heck is the event loop anyway"由 Philip Roberts 在 JSConf EU 2014 上给出

Answer 1

也许这种方法适合您

function foo(args) {
  return new Promise((resolve, reject) => {
      // your code based on args
      if (args.length) {
         console.log("processing", args[0]);
         resolve(args.slice(1, args.length));
      } else {
         reject("finished");
      }
  }).then(args => {
     return foo(args);
  }).catch(() => {
    console.log("Tasks completed...");
  });
}

foo([1, 2, 3 ,4, 5]);

输出应该类似于:

processing 1
processing 2
processing 3
processing 4
processing 5
Tasks completed...