AJAX call in for loop не возвращает значения для коррекции позиций в массиве

Мне нужно получить ряд страниц с помощью AJAX и поместить их в массив, где их заданное место в массиве равно i цикла for (это кэширующая функция для страниц блога и диапазон цикла for полностью переменный). Я делаю что-то похожее на следующее:

var bongo = new Array();

for (i = 0; i < 10; i++) {

    jQuery.ajax({ type: "GET", url: 'http://localhost', data: queryString, success: function(request) { bongo[i] = request } })

}

Проблема заключается в том, что если я не добавлю async: false к параметрам .ajax(что бы сделать это... SJAX?), что заставляет запросы в основном приостанавливать браузер, что противоречит тому, что я пытаюсь сделать, я в обратном вызове успеха всегда будет составлять 11, тогда как я, конечно, хочу, чтобы он вылил возвращаемые данные в каждый слот массива от 0 до 10.

Я попытался заменить строку следующим:

bongo[i] = jQuery.ajax({ type: "GET", url: 'http://localhost', data: queryString }).responseText

Но это не имело значения.

ОТВЕТЫ

Ответ 1

Вам нужно закрыть:

var bongo = [];
for (i = 0; i < 10; i++)
{

  (function(i)
    {
      jQuery.ajax(
        {
          type: "GET",
          url: "http://localhost",
          data: queryString,
          success: function(request) { bongo[i] = request } 
        });  
    })(i);
}

Циклы - это №1, где встроенные функции обрезают людей. bongo[i] = result не вызывается дольше. Значение i в это время отличается (скорее всего, 11). Если вы хотите "захватить" или "захватить" текущее значение i, вам нужно создать новую область. Единственный способ сделать это в javascript - это еще одна функция.

Ответ 2

Try:

var bongo = [];
for (i=0; i<10; i++) {
  $.get("http://localhost", function(result) {
    bongo.push(result);
  }
}

Таким образом, каждый результат будет просто вдаваться в массив, решая необходимость правильности индексов массива. Заказ, однако, не гарантируется. Если это требование, вам понадобится другой подход.

Существует несколько способов решения этой проблемы. Вот один: создать объекты для вашего обратного вызова для сохранения состояния. Вот пример:

function Callback(array, index, result) {
  this.array = array;
  this.index = index;
  this.result = result;
  var obj = this;
  this.func = function() {
    obj.array[obj.index] = obj.result;
  };
}

$(function() {
  var arr = [];
  for (var i=0; i<4; i++) {
    var obj = new Callback(arr, i, "result" + i);
    setTimeout(obj.func, (5-i) * 100);
  }
  setTimeout(function() {
    console.log(arr);
  }, 500);
});

Итак, в вашем случае:

function Callback(array, index) {
  this.array = array;
  this.index = index;
  var obj = this;
  this.callback = function(result) {
    obj.array[obj.index] = result;
  };
}

var bongo = [];
for (i=0; i<10; i++) {
  var ob = new Callback(bongo, i);
  $.get("http://localhost", ob.callback);
}

В основном вышеперечисленное сохраняет все данные в объекте, и поэтому каждый обратный вызов имеет доступ к необходимой информации.

Также учтите, что большинство браузеров ограничивают количество одновременных запросов AJAX, обычно до 2 на хост.