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

需要執(zhí)行 then，所以一定是 return 一個(gè)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()
      })
    }

    // 同時(shí)請求三個(gè)
    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++
      })
    }

    // 同時(shí)請求三個(gè)
    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(‘a(chǎn)ll done!’)
        }
        index++
      })
    }

    // 多個(gè)同時(shí)執(zhí)行
    while(limit > 0) {
      request()
      limit -= 1
    }

  })
}

image.png