Skip to content

请实现一个函数,要求能在页面请求很多时,尽可能快地按照顺序输出返回的结果。

js
const promiseList = [
 new Promise((resolve) => {
  setTimeout(resolve, 1000)
 }),
 new Promise((resolve) => {
  setTimeout(resolve, 2000)
 }),
 new Promise((resolve) => {
  setTimeout(resolve, 3000)
 }),
 new Promise((resolve) => {
  setTimeout(resolve, 1500)
 })
]

fn(promiseList);

要实现在页面请求很多时,尽可能快地按顺序输出返回结果,可以使用 Promiseasync/await 来处理异步请求,并通过控制并发请求数量和使用队列来保持请求的顺序。

以下是一个示例函数processRequests,该函数接收一个包含请求URL的数组,并按照顺序发起异步请求,等待所有请求完成后按顺序输出返回的结果:

javascript
function processRequests(urls) {
  const results = [];

  // 并发请求数量
  const concurrentLimit = 5;

  // 创建一个队列来存储请求
  const queue = urls.slice();

  // 递归函数,依次处理队列中的请求
  async function sendRequest() {
    if (queue.length === 0) {
      // 队列为空,所有请求已完成,输出结果
      console.log(results);
      return;
    }

    // 取出队列中的下一个请求
    const url = queue.shift();

    try {
      // 发起异步请求
      const response = await fetch(url);

      // 处理请求结果,这里假设返回的是文本
      const result = await response.text();

      // 将结果存入数组中
      results.push(result);

      // 递归调用自身,继续处理下一个请求
      sendRequest();
    } catch (error) {
      // 处理请求错误
      console.error(`Request failed for ${url}:`, error);

      // 递归调用自身,继续处理下一个请求
      sendRequest();
    }
  }

  // 控制并发请求数量,同时发送多个请求
  for (let i = 0; i < concurrentLimit; i++) {
    sendRequest();
  }
}

使用示例:

javascript
const urls = [
  'https://api.example.com/1',
  'https://api.example.com/2',
  'https://api.example.com/3',
  // ...更多请求URL
];

processRequests(urls);

processRequests函数将请求URL数组作为参数,并创建一个队列来存储请求。通过控制并发请求数量,每次最多发送concurrentLimit个请求,等待这些请求完成后再继续处理下一个请求。当所有请求完成后,按顺序输出返回的结果。