Выбрать в l oop, сохранить порядок результатов - PullRequest
3 голосов
/ 12 марта 2020

У меня есть ситуация, когда мне нужно l oop через массив URL-адресов и получить результат, но мне нужно сохранить порядок запросов, то есть первый запрос должен быть «сохранен» (запись в файл ) сначала и тд. Результатом запросов являются текстовые файлы, и в их содержимом отсутствуют какие-либо данные, раскрывающие исходный URL-адрес или порядок.

Ниже я сделал демонстрационный пример, который извлекает фиктивные JSON данные.

let promises = [];
let data = [];
let i = 1;

let headers = new Headers();
headers.append('Content-Type', 'application/json');
headers.append('Accept', 'application/json');

const fn = async() => {
  while (i < 5) {
    promises.push(
      fetch('https://reqres.in/api/users/' + i, {
        mode: 'cors',
        headers: headers
      })
      .then(response => response.json())
      .then(json => {
        data.push(json)
      })
    )
    i++;
  }

  await Promise.all(promises).then(() => {
    console.log(data);
  })
}

fn();

Если вы протестируете приведенный выше код, вы увидите, что результаты в случайном порядке (на основе идентификатора), и поскольку файлы в моем исходном коде являются текстовыми файлами, Я не могу отсортировать после выборки.

Ответы [ 2 ]

4 голосов
/ 12 марта 2020

Используйте значения, к которым относятся обещания. Нет необходимости хранить отдельный массив data и вручную добавлять значения к нему. Promise.all гарантирует, что значения в некотором порядке соответствуют обещаниям.

let promises = [];
let i = 1;

let headers = new Headers();
headers.append('Content-Type', 'application/json');
headers.append('Accept', 'application/json');

const fn = async() => {
  while (i < 5) {
    promises.push(
      fetch('https://reqres.in/api/users/' + i, {
        mode: 'cors',
        headers: headers
      })
      .then(response => response.json())
    )
    i++;
  }

  await Promise.all(promises).then(data => {
    console.log(data);
  })
}

fn();

И поскольку вы находитесь в асинхронной c функции, вы можете просто выполнить:

var data = await Promise.all(promises);
console.log(data);
1 голос
/ 12 марта 2020

Кроме того, вы можете вызвать этот способ, создав массив URL-адресов, а затем вызвав Promise.all, который отображает эти URL-адреса и возвращает одно обещание со всеми ответами в массиве:

let headers = new Headers({'Content-Type':'application/json','Accept':'application/json'});
let params = { mode: 'cors', headers};

(async function() {  
  // Create an array or urls
  const urls = [...Array(4).keys()].map(i => `https://reqres.in/api/users/${i+1}`);
  const response = await Promise.all(urls.map(url => fetch(url, params)))
  const data = await Promise.all(response.map(res => res.json()))
  console.log(data)
}());
...