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的数组,并按照顺序发起异步请求,等待所有请求完成后按顺序输出返回的结果:

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(); } }

使用示例:

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

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