如何优雅的实现同步ajax请求

Question

需求是这样的，向后台发送一个请求，返回一个数组["a","b","c"],数组的长度是不确定的，现在需要遍历数组中每个值，作为参数来发送请求，等第一个请求结果返回后，根据返回的结果字段res来决定是否将b作为参数发送第二个请求，想知道用vue-resource如何优雅的实现这个需求，求大神指点

Answer 1

ES7的解决方案 async/await

1. 将异步请求包装为 Promise

2. 使用 async/await "同步化"调用

//包装Promise
function requestA(){
    return new Promise((resolve,reject){
        //ajax请求，请求成功则使用 resolve 回调结果，请求失败则用 reject(new Error('失败信息'))回调
    });
}
//functionB、functionC类似
async function request(){
    try{
    const a = await functionA();
    const b = await functionB();
    const c = await functionC();
    console.log(a,b,c);
    }catch(e){
        console.error(e);
    }
}
//调用
request();

看上去是不是很像同步呢？

Answer 2

用promise的链式方式就可以完美解决异步请求顺序嵌套的问题。

下面是伪代码。

var req = new Promise(function() {})

req.then(function(result) {
  let thenable = {
    then: function(resolve, reject) {
        //第二次请求
        if(response_data) resolove(response_data)
        else reject('err')
    }
  }

  return Promise.resolve(thenable)
})
.then(function(result) {
  let thenable = {
    then: function(resolve, reject) {
        //第三次请求
        if(response_data) resolove(response_data)
        else reject('err')
    }
  }

  return Promise.resolve(thenable)
})
.then(function(result) {
  // finished
})
.catch(err => {console.log(err)})

Answer 3

fetch呢？

Answer 4

根据你的问题描述，你需要的并不是同步ajax请求，而是以同步的风格来写ajax的异步逻辑。楼上说的promise和async都能满足你。

但是如果你真的想要同步发送ajax请求的话，以前理论上是可以的，但是现在这是最差的实践，没有人会同步地发ajax请求的。