0

我使用谷歌地图 api 计算从许多不同起点到目的地点的最短路径。我决定这样做：（计算每对点，而不是将结果保存到数组中，而不是最后检查哪个是最好的）。但是我对回调有疑问-因为正如评论所说，数组始终为零-因为此代码是在所有请求计算路由长度之前执行的。

function foo(){
var directionsService = new google.maps.DirectionsService();
var destination = new google.maps.LatLng(x,y);
var arrayOfRes= [];

for(var index in originPoints){
    var request = {
        origin:originPoints[index].marker.position,
        destination:destination,
        travelMode: google.maps.TravelMode.DRIVING
    };
    directionsService.route(request, function(result, status) {
            if (status == google.maps.DirectionsStatus.OK) {
                var res = {};
                res.length = result.routes[0].legs[0].distance.value;
                res.index = index;
                res.result = result;
                arrayOfRes.push(res);
            }
     });
}
  //here arrayOfRes.length is always 0
if(arrayOfRes.length>1)
{
    var bestResult = arrayOfRes[0];

    for(var i = 1; i < arrayOfRes.length; i++)
    {
        if(bestResult.length > arrayOfRes[i])
            bestResult = arrayOfRes[i];
    }

    console.log("Best is" + bestResult.length);
}
else if(arrayOfRes.length ==1)
{
    var bestResult = arrayOfRes[0];
}
 }

如何编写带有回调的函数，使其等到所有请求都结束？

4

1 回答 1

1

像这样的谷歌请求是异步的，所以你必须编写异步代码，这意味着只使用回调返回的数据。

在返回路由的回调函数中，您需要检查这是否是最后一个请求的答案。如果是这样，那么您的数组具有所有结果，然后您可以处理该数组。

假设这originPoints是一个数组，你可以这样做：

var arrayOfRes = [];
for (var index = 0; index < originPoints.length; ++index) {
    var request = {
        origin:originPoints[index].marker.position,
        destination:destination,
        travelMode: google.maps.TravelMode.DRIVING
    };
    directionsService.route(request, function(result, status) {
        if (status == google.maps.DirectionsStatus.OK) {
            var res = {};
            res.length = result.routes[0].legs[0].distance.value;
            res.index = index;
            res.result = result;
            arrayOfRes.push(res);

            // check if all data has arrived
            if (arrayOfRes.length === originPoints.length) {
                // put code here to process arrayOfRes
            }
        }
    });
}

注意：javascript 无法让您的代码等待所有请求完成然后继续 - 因此您必须使用异步编程风格，代码流从回调继续。

注意：因为directionsService.route是异步调用，所以以后会调用它的回调。同时，你的 JS 会继续执行。这意味着紧随此代码块之后的代码将在 ajax 调用完成之前执行并且之前arrayOfRes被填充。因此，您可以安全使用arrayOfRes数据的唯一位置是回调本身或您从回调调用的函数中。

于 2013-11-11T20:02:01.860 回答