需求

封装一个函数,做到可以进行并发请求,并将结果返回。

该函数接收两个参数,分别为urlsmaxNum
urls是数组,其中元素均为请求地址;maxNum表示最大并发数。

如果有完成的请求,会从urls中,按序取出下一个请求,请求的结果会计入返回的数组中,返回的数组中元素的索引与参数urls中保持一致。

function concurRequest(urls, maxNum) {
  return new Promise(resolve => {
  	// urls为空,直接返回
    if (urls.length === 0) {
      resolve([])
      return
    }
    
    let result = [] // 请求结果
    let index = 0 // urls索引
    let count = 0 // 当前请求完成数

    async function request() {
      if (index === urls.length) return // urls全部遍历了
      const i = index // 当前请求索引
      const url = urls[index] // 当前请求url
      index++

      try {
        const resp = await fetch(url) // 请求
        result[i] = resp // 将请求结果按照urls的顺序放入result数组中
      } catch (err) {
        result[i] = err
      } finally {
        count++ // 请求完成数+1
        if (count === urls.length) { resolve(result) }// 判断是否所有请求都已完成
        request()
      }
    }

    const min = Math.min(urls.length, maxNum)
    for (let i = 0; i < min; i++) {
      request()
    }
  })
}

测试

const urls = []
for (let i = 1; i < 11; i++) {
  urls.push(`https://jsonplaceholder.typicode.com/todos/${i}`)
}
concurRequest(urls, 3).then(res => {
  console.log(res);
})
03-26 15:13