js 如何写一个函数，参数为多个请求地址，在函数内部依次发起请求，最后返回所有请求的状态？

Question

面试题：js 手写一个函数，参数为多个请求地址组成的集合，然后在函数内部依次发起请求，响应内容是下一次请求的参数，最后返回所有请求的状态。

不知该从何下手。。。

Answer 1

类似这样？

function test(urls) {
    let request = function(url, param) {
        // 发出请求的逻辑
        console.log("本次发出的请求、参数: ", url, param)
        
        //按需要可以返回请求状态、响应内容
        return param + 1
    }

    let response = 0 //默认第一个请求的参数
    let ans = []
    for (let i = 0; i < urls.length; i++) {
        response = request(urls[i], response)
        ans.push(response)
    }
    
    return ans
}

$ test(["a", "b", "c"])
本次发出的请求、参数:  a 0
本次发出的请求、参数:  b 1
本次发出的请求、参数:  c 2

Answer 2

这个感觉是用Promise进行实现吧？像这种的：

p1.then(data=>{
    console.log(data)
    return p2;
}).then(data=>{
    console.log(data)
    return p3;
}).then(data=>{
    console.log(data)
})

Answer 3

依次请求时，我们用async-await就可以搞定：

const urls = ["http://a.com", "http://b.com", "http://c.com", "http://d.com"];

const request = async (list) => {
  const allResult = []; // 所有的结果
  let lastResult = null; // 上次请求的结果

  for (let i = 0; i < list.length; i++) {
    const res = await fetch(list[i], { data: lastResult });
    lastResult = res;
    allResult.push(res);
  }
  return allResult;
};

request(urls);

request()整体是一个Promise，是用async-await来控制的，只有await 后面有结果时，才会进行后续的流程。

参考文章：

• JavaScript 中的 Promise 异步并发控制

Answer 4

如果不考虑兼容性，用async/await会相对简单点，已经有人回答了，借助语法特性写起来跟普通循环没区别。如果是不能使用的情况下，比如像JQ的ajax采用的回调的方式，那就考虑使用递归了，示例如下：

function ajax(options) {
  console.log('ajax', options.url)
  setTimeout(() => options.success(options.url), 1000)
}
function serialAjax(urls, cb) {
  const res = [];
    (function run(i, data) {
    if(i==urls.length) return cb(res)
    ajax({
      url: urls[i],
      data,
      success: response => {
        res.push(response);
        run(i+1, response)
      }
    })
  })(0)
}

serialAjax(['u','r','l'], console.log)