JS асинхронная / ожидающая очередь задач

Question

В моем приложении JS я использую функцию async / await.Я хотел бы выполнить несколько вызовов API и хотел бы, чтобы они запускались один за другим.Другими словами, я хотел бы заменить этот простой метод:

    const addTask = async (url, options) => {
        return await fetch(url, options)
    }

чем-то более сложным, например:

    let tasksQueue = []
    const addTask = async (url, options) => {
        tasksQueue.push({url, options})
        ...// perform fetch in queue
        return await ...
    }

Каким будет лучший способ обработки асинхронных возвратов?

Answer 1

Вы можете сохранить предыдущее ожидающее обещание, дождитесь его, прежде чем позвонить на следующий fetch.

// fake fetch for demo purposes only
const fetch = (url, options) => new Promise(resolve => setTimeout(resolve, 1000, {url, options}))

// task executor
const addTask = (() => {
  let pending = Promise.resolve();
  
  const run = async (url, options) => {
    try {
      await pending;
    } finally {
      return fetch(url, options);
    }
  }

  // update pending promise so that next task could await for it
  return (url, options) => (pending = run(url, options))
})();

addTask('url1', {options: 1}).then(console.log)

addTask('url2', {options: 2}).then(console.log)

addTask('url3', {options: 3}).then(console.log)