如何正确使用setTimeout或setInterval

Question

我正在使用Google Maps，并试图暂停执行以防止QUERY_LIMIT使用问题。 我绘制地址的函数如下所示。

该代码有效，但是我想尝试setTimeout或setInterval来查看它在UI上看起来是否更好。

我怎么称呼它，第一个参数应该是什么？

非常感谢。

  vLocations = [];

  for (var i = 0; i < vAddresses.length; i++) {

    //pause to prevent OVER_QUERY_LIMIT issue
    //geocode "free" usage limit is 5 requests per second
    //setTimeout(PlotAddressesAsUnAssigned, 1000);
    //sleep(500);

    //this will resolve the address and store it in vLocations
    AddWaypointAndUnassigned(vAddresses[i]);

    var z = i % 4;
    if (z==0 && i != 0) {
     //sleep after every 5th geocode call
     //alert('going to sleep...i: ' + i);
     //sleep(3000);
    }

  }

Answer 1

在循环（同步）内执行暂停（异步执行）通常会带来很多麻烦。

您可以使用仅在超时结束时执行的递归调用。

var vLocations = [];

// Manages the timeout and recursive calls 
function AddWaypointAndUnassignedWithPause(index){
    setTimeout(function(){
        // When the timeout expires, we process the data, and start the next timeout
        AddWaypointAndUnassigned(vAddresses[index]);

        // Some other code you want to execute        
        var z = i % 4;
        if (z==0 && i != 0) {
            //sleep after every 5th geocode call
            //alert('going to sleep...i: ' + i);
            //sleep(3000);
        }    

        if(index < vAddresses.length-1)
            AddWaypointAndUnassignedWithPause(++index);
    }, 1000);
}

// Start the loop
AddWaypointAndUnassignedWithPause(0);

JSFiddle示例。

Answer 2

试试这个，希望对您有所帮助

vLocations = [];

for (var i = 0; i < vAddresses.length; i++) {

    //pause to prevent OVER_QUERY_LIMIT issue
      setTimeout(function(){
            //this will resolve the address and store it in vLocations
            AddWaypointAndUnassigned(vAddresses[i]);
       }, 500);
  var z = i % 4;
   if (z==0 && i != 0) {
    //sleep after every 5th geocode call
    //alert('going to sleep...i: ' + i);
    //sleep(3000);
   }

}

Answer 3

一条等待线呢，当添加一项时触发，而在没有剩余项时停止。

使用setTimeout：

var INTERVAL = 1000 / 5;

var to = null;

var vLocations = [];

function addAddress(vAddress) {
    vLocations.push(vAddress);
    startTimeout();
}

function startTimeout() {
    if( to === null ) {
        to = setTimout(processLocation, INTERVAL);
    }
}

function processLocation() {

    if( vLocations.length ) {

        var vAddress = vLocations.shift();
        AddWaypointAndUnassigned(vAddress);

        to = setTimout(processLocation, INTERVAL);
    } else {
        to = null;
    }
}

使用setInterval：

var INTERVAL = 1000 / 5;

var to = null;

var vLocations = [];

function addAddress(vAddress) {
    vLocations.push(vAddress);
    startInterval();
}

function startInterval() {
    if( to === null ) {
        to = setInterval(processLocation, INTERVAL);
    }
}

function processLocation(cb) {

    if( vLocations.length ) {
        var vAddress = vLocations.shift();
        AddWaypointAndUnassigned(vAddress);
    } else
        clearInterval(to);
        to = null;
    }
}