Использование SetTimeout с JQuery каждый

Question

Я хотел бы добавить 500мс пауза между каждой итерации первого $.each

Я не уверен, как применять это решение: How to add pause between each iteration of jQuery .each()?

в моем конкретном случае:

function iterateAddresses() { 

    var time = 500; 

    $.each(addresses_google, function(index, value) { 
    var service = new google.maps.DistanceMatrixService(); 

    service.getDistanceMatrix(
     { 
     origins: [origin], 
     destinations: value, 
     travelMode: 'DRIVING' 
     }, 
     callback 
    ); 

    function callback(response, status) { 
     var origins = response.originAddresses; 
     var destinations = response.destinationAddresses; 
     for (var i = 0; i < origins.length; i++) { 
     var results = response.rows[i].elements; 
     for (var j = 0; j < results.length; j++) { 
      var element = results[j]; 
      if(element.status == "NOT_FOUND"){ 
      var distance = 0; 
      } else { 
      var distance = element.distance.value; 
      } 
      if(distance > radius){ 
      // Store postids in array 
      postids_to_hide.push(
       addresses_postids[index][j] 
      ); 
      // Hide elements where postid is in the postids_to_hide arrays 
      $.each(postids_to_hide, function(index, value) { 
       $(".main_short_post_div").filter(function(){ 
       return $(this).attr('data-post-id') === value; 
       }).hide(); 
      }); 
      } // end if d < r 
     } // end for j 
     } // end for i 
    } // end callback function 
    }); // end each addresses_google 

}; // end iterateAddresses 

iterateAddresses(); 

Answer 1

Вы могли бы выделить в другой функции, называемой так вашим iterateAddresses() функция

function iterateAddresses() { 

    var time = 500; 
    // Then get a random number between 500 and 599  
    $.each(addresses_google, function(index, value) { 
     var ram = Math.floor(Math.random() * (599-time+1)) + time; 
     setTimeout("OtherFunction("+index+","+value+");", ram); 
    }); // end each google_address 

}; // end iterateAddresses 


function OtherFunction(index, value) 
{ 
    var service = new google.maps.DistanceMatrixService(); 

    service.getDistanceMatrix(
     { 
     origins: [origin], 
     destinations: value,//addresses_google, 
     travelMode: 'DRIVING' 
     }, 
     callback 
    ); 

    function callback(response, status) { 
     var origins = response.originAddresses; 
     var destinations = response.destinationAddresses; 
     for (var i = 0; i < origins.length; i++) { 
     var results = response.rows[i].elements; 
     for (var j = 0; j < results.length; j++) { 
      var element = results[j]; 
      if(element.status == "NOT_FOUND"){ 
      var distance = 0; 
      } else { 
      var distance = element.distance.value; 
      } 
      var from = origins[i]; 
      var to = destinations[j]; 
      if(distance > radius){ 
      // Store postids in array 
      postids_to_hide.push(
       addresses_postids[index][j] 
      ); 
      // Hide elements where postid is in the postids_to_hide arrays 
      $.each(postids_to_hide, function(index, value) { 
       $(".main_short_post_div").filter(function(){ 
       return $(this).attr('data-post-id') === value; 
       }).hide(); 
      }); 
      } // end if d < r 
     } // end for j 
     } // end for i 
    } // end callback function 
} 

iterateAddresses(); 

Answer 2

function asyncForEach(arr, cb) { 
    return arr.reduce((p,c)=>{ 
     return p.then(()=>cb(c)); 
    }, Promise.resolve()); 
} 
function wait(ms) { 
    return()=>new Promise(resolve=>setTimeout(resolve, ms)); 
} 

const DELAY = 500; //ms 
function iterateAddresses() { 
    return asyncForEach(addresses_google, address => 
     getDistanceMatrix(address) 
     .then(processResult) 
     .then(wait(DELAY))); 
} 

iterateAddresses(); 

getDistanceMatrix является многообещающей версией функции, которую вы предоставили $.each.

processResult является многообещающей версией callback.