看了前端很多文章我感觉并发不应该只是控制几个接口去发送应该考虑到每个接口完成的时间是不同的所以今天我试着写了一个如果并发中接口完成了请求就继续发送其他接口的js 简单测试了一下感觉没问题还请各位提个建议!DOCTYPE html html langen head meta charsetUTF-8 meta nameviewport contentwidthdevice-width, initial-scale1.0 titleDocument/title /head body script srchttp://ajax.aspnetcdn.com/ajax/jquery/jquery-2.0.0.min.js/script script const endpoints [ () $.ajax({ url: https://jsonplaceholder.typicode.com/todos/1, method: GET, dataType: json, }), () $.ajax({ url: https://jsonplaceholder.typicode.com/todos, method: GET, dataType: json, }), () $.ajax({ url: https://jsonplaceholder.typicode.com/photos, method: GET, dataType: json, }), () $.ajax({ url: https://dog.ceo/api/breeds/image/random111, method: GET, dataType: json, }), () $.ajax({ url: https://jsonplaceholder.typicode.com/todos/4, method: GET, dataType: json, }), () $.ajax({ url: https://jsonplaceholder.typicode.com/todos/5, method: GET, dataType: json, }), ]; function parallelLimit(taskFns, limit) { const length taskFns.length; // 1) 空数组快速返回 if (length 0) return Promise.resolve([]); // 2) 并发数校验 if (!Number.isInteger(limit) || limit 1) { return Promise.reject(new Error(并发数必须为正整数)); } //3) 判断当前执行结果会有多少个 const results new Array(length); let completed 0; //记录执行了多少次 let nextIndex 0; //记录下一次执行的索引 return new Promise((resolve, reject) { // 创建runNext函数 function runNext() { // 如果下一次执行的索引大于等于数组长度返回 if (nextIndex length) return; // 获取当前执行的索引 const current nextIndex; Promise.resolve() // 开始执行任务 .then(() taskFns[current]()) // 成功后走这里 .then((res) { results[current] { status: 成功, res }; completed; }) //失败后走这里 .catch((error) { results[current] { status: 失败, error }; completed; }) // 无论成功还是失败都会走这里 .finally(() { if (completed length) { resolve(results); } else { runNext(); } }); } // 判断一下limit 是否大于length const starters Math.min(limit, length); for (let i 0; i starters; i) runNext(); }); } function main() { const concurrency 2; console.log(开始请求, 并发数 , concurrency); parallelLimit(endpoints, concurrency).then((results) { console.log(全部完成, 结果如下:); console.log(results); }); } main(); /script /body /html
看了前端很多文章我感觉并发不应该只是控制几个接口去发送应该考虑到每个接口完成的时间是不同的所以今天我试着写了一个如果并发中接口完成了请求就继续发送其他接口的js 简单测试了一下感觉没问题还请各位提个建议!DOCTYPE html html langen head meta charsetUTF-8 meta nameviewport contentwidthdevice-width, initial-scale1.0 titleDocument/title /head body script srchttp://ajax.aspnetcdn.com/ajax/jquery/jquery-2.0.0.min.js/script script const endpoints [ () $.ajax({ url: https://jsonplaceholder.typicode.com/todos/1, method: GET, dataType: json, }), () $.ajax({ url: https://jsonplaceholder.typicode.com/todos, method: GET, dataType: json, }), () $.ajax({ url: https://jsonplaceholder.typicode.com/photos, method: GET, dataType: json, }), () $.ajax({ url: https://dog.ceo/api/breeds/image/random111, method: GET, dataType: json, }), () $.ajax({ url: https://jsonplaceholder.typicode.com/todos/4, method: GET, dataType: json, }), () $.ajax({ url: https://jsonplaceholder.typicode.com/todos/5, method: GET, dataType: json, }), ]; function parallelLimit(taskFns, limit) { const length taskFns.length; // 1) 空数组快速返回 if (length 0) return Promise.resolve([]); // 2) 并发数校验 if (!Number.isInteger(limit) || limit 1) { return Promise.reject(new Error(并发数必须为正整数)); } //3) 判断当前执行结果会有多少个 const results new Array(length); let completed 0; //记录执行了多少次 let nextIndex 0; //记录下一次执行的索引 return new Promise((resolve, reject) { // 创建runNext函数 function runNext() { // 如果下一次执行的索引大于等于数组长度返回 if (nextIndex length) return; // 获取当前执行的索引 const current nextIndex; Promise.resolve() // 开始执行任务 .then(() taskFns[current]()) // 成功后走这里 .then((res) { results[current] { status: 成功, res }; completed; }) //失败后走这里 .catch((error) { results[current] { status: 失败, error }; completed; }) // 无论成功还是失败都会走这里 .finally(() { if (completed length) { resolve(results); } else { runNext(); } }); } // 判断一下limit 是否大于length const starters Math.min(limit, length); for (let i 0; i starters; i) runNext(); }); } function main() { const concurrency 2; console.log(开始请求, 并发数 , concurrency); parallelLimit(endpoints, concurrency).then((results) { console.log(全部完成, 结果如下:); console.log(results); }); } main(); /script /body /html
