插件窝 干货文章 JavaScript并发请求:如何依次获取所有请求结果?

JavaScript并发请求:如何依次获取所有请求结果?

请求 const results url 505    来源:    2025-03-22

在JavaScript中,处理并发请求并依次获取所有请求结果通常可以通过以下几种方式实现:

1. 使用 Promise.all

Promise.all 可以并行执行多个异步请求,并在所有请求完成后返回一个包含所有结果的数组。

const urls = ['url1', 'url2', 'url3'];

const fetchData = async (url) => {
  const response = await fetch(url);
  return response.json();
};

const getAllData = async () => {
  const promises = urls.map(url => fetchData(url));
  const results = await Promise.all(promises);
  return results;
};

getAllData().then(results => {
  console.log(results); // 所有请求的结果数组
});

2. 使用 async/awaitfor 循环

如果你希望依次执行请求(即一个请求完成后才开始下一个请求),可以使用 async/await 结合 for 循环。

const urls = ['url1', 'url2', 'url3'];

const fetchData = async (url) => {
  const response = await fetch(url);
  return response.json();
};

const getAllDataSequentially = async () => {
  const results = [];
  for (const url of urls) {
    const data = await fetchData(url);
    results.push(data);
  }
  return results;
};

getAllDataSequentially().then(results => {
  console.log(results); // 所有请求的结果数组
});

3. 使用 reducePromise

你也可以使用 reduce 来依次处理每个请求。

const urls = ['url1', 'url2', 'url3'];

const fetchData = async (url) => {
  const response = await fetch(url);
  return response.json();
};

const getAllDataSequentially = async () => {
  const results = await urls.reduce(async (previousPromise, url) => {
    const acc = await previousPromise;
    const data = await fetchData(url);
    acc.push(data);
    return acc;
  }, Promise.resolve([]));
  return results;
};

getAllDataSequentially().then(results => {
  console.log(results); // 所有请求的结果数组
});

4. 使用 for...ofawait

类似于 for 循环,for...of 也可以用来依次处理每个请求。

const urls = ['url1', 'url2', 'url3'];

const fetchData = async (url) => {
  const response = await fetch(url);
  return response.json();
};

const getAllDataSequentially = async () => {
  const results = [];
  for await (const url of urls) {
    const data = await fetchData(url);
    results.push(data);
  }
  return results;
};

getAllDataSequentially().then(results => {
  console.log(results); // 所有请求的结果数组
});

总结

  • Promise.all:适合并行执行多个请求,并在所有请求完成后获取结果。
  • async/awaitfor 循环:适合依次执行请求,一个请求完成后才开始下一个请求。
  • reducePromise:适合依次处理每个请求,并且可以在处理过程中累积结果。
  • for...ofawait:类似于 for 循环,适合依次处理每个请求。

根据你的需求选择合适的方案。如果你需要并行执行请求并获取所有结果,Promise.all 是最常用的方法。如果你需要依次执行请求,async/await 结合 for 循环或 reduce 是更好的选择。