现有 40 个异步请求须要发送,但因为某些缘由,咱们必须将同一时刻并发请求数量控制在 6 个之内,同时还要尽量快速的拿到响应结果。应该怎么作?面试
这个问题与一道经典面试题很相似:数组
实现一个批量请求函数 multiRequest(urls, maxNum),要求以下: • 要求最大并发数 maxNum • 每当有一个请求返回,就留下一个空位,能够增长新的请求 • 全部请求完成后,结果按照 urls 里面的顺序依次打出
串行是一个 http 请求成功后再次发起下一个 http 请求;promise
优势浏览器
缺点:并发
const p = () => { return new Promise((resolve, reject) => { setTimeout(() => { console.log("1000"); resolve(); }, 1000); }); }; const p1 = () => { return new Promise((resolve, reject) => { setTimeout(() => { console.log("2000"); resolve(); }, 2000); }); }; const p2 = function () { return new Promise((resolve, reject) => { setTimeout(() => { console.log("3000"); resolve(); }, 3000); }); }; p().then(() => { return p1(); }).then(() => { return p2(); }).then(() => { console.log("end"); });
参数数组中全部 promise 都达到resolve
状态,才执行then
回调。异步
缺点:函数
const promises = () => { return [1000, 2000, 3000].map((current) => { return new Promise((resolve, reject) => { setTimeout(() => { console.log(current); resolve(); }, current); }); }); }; Promise.all(promises()).then(() => { console.log("end"); });
Promise.all 并发限制指的是:每一个时刻并发执行的promise
数量是固定的,最终的执行结果仍是保持与原来的Promise.all
一致。fetch
添加最大并发数 maxRequestNum,全部请求完成后再返回。url
优势:code
缺点:
const multiRequest = (fetch, params = [], maxRequestNum = 6) => { const paramsLength = params.length; let result = new Array(paramsLength).fill(false); let sendCount = 0; let finishCount = 0; return new Promise((resolve) => { while (sendCount < maxRequestNum && sendCount < paramsLength) { next(); } function handleResult(current, res) { finishCount ++; result[current] = res; if (sendCount < paramsLength) { next(); } if (finishCount >= paramsLength) { resolve(result); } } function next() { let current = sendCount++; const param = params[current]; fetch(param).then((res) => { handleResult(current, res) }).catch((err) => { handleResult(current, err) }); } }); }