javascript - 控制 AJAX 请求

Question

是否有办法停止额外的 AJAX 请求并一次触发一个请求？我有一个打印应用程序，因此我需要在处理下一个请求之前处理每个请求。在我的代码中，我有一个平均迭代约 15 次的循环，这将使每次迭代都进行 AJAX 调用，并处理响应 $.when() 准备就绪的情况。问题是每个响应在返回时都会得到处理，而不是在前一个响应完成时进行处理。我真的试图避免使我的调用同步，但是有没有办法一次处理这些响应呢？

Answer 1

是的，将 Promise 存储在原始数组中，然后再次循环原始数组以传递给 $.when。回调将按顺序包含参数。

var myData = [
  {
    name: 'apple',
    color: 'red'
  },
  {
    name: 'orange',
    color: 'orange'
  }
];

myData.forEach(function (obj) {
  obj.promise = $.get('/object-info', obj);
});

$.when.apply($, myData.map(function (obj) {
  return obj.promise;
})).then(function () {
  var args = Array.prototype.slice.call(arguments);
  args.forEach(function (result) {
    console.log(result); // results in order
  })
});

// *** MOCK

$.get = function (url, data) {
    var defer = $.Deferred()
    setTimeout(function () {
        defer.resolve(data.color);
    }, 1500);
    return defer.promise();
};

// *** END MOCK

var myData = [
  {
    name: 'apple',
    color: 'red'
  },
  {
    name: 'orange',
    color: 'orange'
  }
];

myData.forEach(function (obj) {
  obj.promise = $.get('/object-info', obj);
});

$.when.apply($, myData.map(function (obj) {
  return obj.promise;
})).then(function () {
  var args = Array.prototype.slice.call(arguments);
  args.forEach(function (result) {
    console.log(result); // results in order
  })
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>