限制最大个数的并发请求

const urls = [];
for (let i = 1; i <= 10; i++) {
  urls.push(`https://jsonplaceholder.typicode.com/todos/${i}`)
}
limitRequest(urls, 3).then(res => {
  console.log(res, 999)
})

需要执行 then,所以一定是 return 一个promise。

function limitRequest(urls, limit) {
  return new Promise(resolve => {

    function request() {
      const url = urls.shift()

      if(!url) return

      fetch(url).then(res => {
        console.log(res);
        request()
      })
    }

    // 同时请求三个
    request()
    request()
    request()
  })
}
image.png

resolve 或 finally 之后都可以直接 .then

function limitRequest(urls, limit) {
  return new Promise(resolve => {
    let index = 0

    function request() {
      const url = urls.shift()

      if(!url) return

      fetch(url).then(res => {
        console.log(res);
        request()

        if(index === 9) { // urls.length
          return resolve('all done!')
        }
        index++
      })
    }

    // 同时请求三个
    request()
    request()
    request()
  })
}
    request()
    request()
    request()

可以简化为:

while(limit > 0) {
  limit -= 1
  request()
}

最终:

function limitRequest(urls, limit = 3) {
  return new Promise(resolve => {
    let index = 0

    function request() {
      const url = urls.shift()

      if(!url) return

      fetch(url).then(res => {
        request()

        if(index === 9) {
          return resolve(‘all done!’)
        }
        index++
      })
    }

    // 多个同时执行
    while(limit > 0) {
      request()
      limit -= 1
    }

  })
}
image.png
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • JavaScript,通常缩写为 JS,是一种解释执行的编程语言。它是现在最流行的脚本语言之一。 JavaScri...
    神齐阅读 5,016评论 1 32
  • ECMAScript - 学习笔记 🎬 🧩nvm node.js 包管理工具 nvm github[https:/...
    Super三脚猫阅读 661评论 0 1
  • css相关 1. 万能居中 1.margin: 0 auto;水平 2.text-align: center;水平...
    chaocc阅读 1,011评论 0 2
  • 1. 基础类型和类型检测 简单类型:Undefined, Null, boolean, number, strin...
    anearseeyou阅读 297评论 0 0
  • 1.Typescript中的&理解 参数中的 & 表示props对象同时拥有了TagManagementState...
    Lethe35阅读 7,691评论 0 1