Как сделать рекурсивный последовательный async-await?

Нужно строго последовательно выполнить серию асинхронных запросов и полученные данные запушить в массив. Исходные данные имеют древовидную структуру:

let data = [{
  url: '/some-url',
  children: [
    {
      url: 'some-url',
      children: null
    },
    {
      url: 'some-url',
      children: [
        url: 'some-url',
        children: null
      ]
    }
  ]
},
{
  url: 'some-url',
  children: null
}]


Требуется написать цикл, который рекурсивно обрабатывать массив, делая запросы на url-ы. Т.е. при первой итерации делает запрос, дожидается ответа, пушит ответ в массив, затем проверяет, если ли у объекта на данном уровне children, если есть, то делает все то же самое с children'ами. Иначе говоря, на выходе должен получиться одномерный массив с данными, полученными по урлам. Использую axios в vue-приложении, т.е. запросы делаются this.axios.get(url).
Как лучше всего решить подобную задачу?
  • Вопрос задан
  • 723 просмотра
Решения вопроса 1
0xD34F
@0xD34F Куратор тега JavaScript
Последовательно:

async function fetchRecursive(arr) {
  const result = [];

  if (Array.isArray(arr)) {
    for (const n of arr) {
      try {
        result.push({ status: true, result: await fetch(n.url).then(r => r.json()) });
      } catch(error) {
        result.push({ status: false, error });
      }

      result.push(...await fetchRecursive(n.children));
    }
  }

  return result;
}

Параллельно:

const flat = arr => (arr || []).flatMap(n => [ n.url, ...flat(n.children) ]);

const fetchRecursive = arr => Promise.allSettled(flat(arr).map(n => fetch(n).then(r => r.json())));
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
@AndrewRusinas
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы