Javascript 数组 returns 从 $.ajax 调用记录时的无序索引列表

Question

我有一个恰好包含 10 个元素的简单数组；它们的 key、value 对 return 在记录时正确排序。

$.each( sArray, function(i, k) {
   log(i, k);

   // log(i, k) returns correctly 
   // [0] ELEMENT ONE
   // [1] ELEMENT TWO
   // [2] ELEMENT THREE

});

但是，我无法理解为什么当引入 $.ajax 调用并从那里记录数组时，索引 return 无序（每次刷新页面只是随机排序）

$.each( sArray, function(i, k) {

   $.ajax({
       success: function(data){
          
          log(i, k);

          // returns unordered
          // [2] ELEMENT TWO
          // [1] ELEMENT ONE
          // [3] ELEMENT THREE
          // [5] ELEMENT FIVE
          // [4] ELEMENT FOUR
          // etc...
       }
    });
});

Key、value 对匹配，但只是无序。有人可以解释这种行为吗？谢谢！

Answer 1

因为AJAX是异步的。 AJAX 操作的完成顺序没有保证。

如果您需要顺序保持一致，那么您可能需要先完成所有 AJAX 操作，然后再对数组的顺序执行您的操作。也许是这样的：

let promises = [];
$.each( sArray, function(i, k) {
  promises.push(
    $.ajax({
      /.../
      success: function(data){
        // Do something with data?
        // Maybe add it as a property to k?
        // For example:
        k.data = data;
      }
    })
  );
});

Promise.all(promises).then(function () {
  // Here all of the AJAX operations are complete.
  // You can again iterate over the array in the order you like:
  $.each(sArray, function(i, k) {
    log(i, k);
    // In this example, k.data should have the data received from AJAX.
  });
});

Javascript 数组 returns 从 $.ajax 调用记录时的无序索引列表

Javascript array returns unordered index list when logged from $.ajax call

javascript

arrays

indexing

ajax

unordered