javascript - Delay Ajax Function per request with Google Maps API -

i want data places using google places api. thing is, want data more 1000 records, per city of region i'm looking for.

i'm searching pizzeria, , want pizzerias in region i've defined. have array this:

['pizzeria+paris','pizzeria+marseille','pizzeria+nice','pizzeria+toulouse'] 

my objective make single request, wait 3sec(or more), , process second request. i'm using lodash library me iterate.

here code:

function formatdetails(artisan){   var latitude = artisan.geometry.location.lat;   var longitude = artisan.geometry.location.lng;   var icon = artisan.icon;   var id = artisan.id;   var name = artisan.name;   var place_id = artisan.place_id;   var reference = artisan.reference;   var types = artisan.types.tostring();    $('#details').append('<tr>'+   '<td>'+latitude+'</td>'+   '<td>'+longitude+'</td>'+   '<td>'+icon+'</td>'+   '<td>'+id+'</td>'+   '<td>'+name+'</td>'+   '<td>'+place_id+'</td>'+   '<td>'+reference+'</td>'+   '<td>'+types+'</td>'+   '</tr>'); }   var getdata = function(query, value){  $.ajax({       url: query,       type: "get",       crossdomain: true,       datatype: "json",       success: function(response) {         var artisan = response.results;         console.log(artisan);         (var = 0; < artisan.length; i++){           formatdetails(artisan[i]);           settimeout(function(){console.log('waiting1');},3000);         }         settimeout(function(){console.log('waiting2');},3000);       },error: function(xhr, status) {         console.log(status);       },       async: false     });   }     $(document).ready(function(){  var places = ['pizzeria+paris','pizzeria+marseille','pizzeria+nice','pizzeria+toulouse'];    _.foreach(places, function(value, key) {     var proxy = 'https://cors-anywhere.herokuapp.com/';     var target_url = 'https://maps.googleapis.com/maps/api/place/textsearch/json?query='+value+'&key=aizasyacltjhwq7afgkhmuwxlnuvbzfpiktkora';     var query = proxy + target_url;     getdata(query, value);   });     });  

i've tried lot of solutions found on stackoverflow, no 1 working, or might have done them wrong.

thanks help!

the fact $.ajax returns promise makes quite simple

firstly, want getdata return $.ajax - , rid of async:false

var getdata = function(query, value) {     return $.ajax({         url: query,         type: "get",         crossdomain: true,         datatype: "json",         success: function(response) {             var artisan = response.results;             (var = 0; < artisan.length; i++){                 formatdetails(artisan[i]);             }         },error: function(xhr, status) {             console.log(status);         }     });   } 

then, can use array.reduce iterate through array, , chain requests together, 3 second "delay" after each request

like so:

$(document).ready(function(){     var places = ['pizzeria+paris','pizzeria+marseille','pizzeria+nice','pizzeria+toulouse'];     places.reduce((promise, value) => {         var proxy = 'https://cors-anywhere.herokuapp.com/';         var target_url = 'https://maps.googleapis.com/maps/api/place/textsearch/json?query='+value+'&key=aizasyacltjhwq7afgkhmuwxlnuvbzfpiktkora';         var query = proxy + target_url;         return promise.then(() => getdata(query, value))             // return promise resolves after 3 seconds         .then(response => new promise(resolve => settimeout(resolve, 3000)));     }, promise.resolve()) /* start reduce resolved promise start chain*/     .then(results => {         // results available here     }); });