javascript，包括google函数内部循环中的变量

javascript, including variables from loop inside google functions

本文关键字：循环 变量 内部 函数 包括 google javascript      更新时间：2023-10-25

所以您可能也看到过类似的情况，有人在for循环中的函数中使用"i"变量时遇到问题。现在可以很容易地修复：

(function(){
    return function() {
        //something
    }
})(i);

但是，在我的场景中，我该如何做到这一点？

GMap.prototype.drawDirection = function (directionsRenderer, directionsService, headMarker, tailMarkers, callback) {
var request;
var array = [];
var count = 0;
for (var i = 0; i < tailMarkers.length; i++) {
    count = i;
    request = {
        origin: headMarker.getPosition(),
        destination: tailMarkers[i].getPosition(),
        travelMode: google.maps.DirectionsTravelMode.DRIVING,
        unitSystem: google.maps.DirectionsUnitSystem.METRIC
    };
    directionsService.route(request, function (response, status) {
        if (status == google.maps.DirectionsStatus.OK) {
            directionsRenderer.setDirections(response);
            console.log(i + " " + count);
            callback(response.routes[0].legs[0].distance.value, i, tailMarkers.length - 1);
        } else {
            alert('Error: ' + status);
        }
    });
    }
};

更准确地说，它是关于directionsService对象：

directionsService.route(request, function (response, status) {
    if (status == google.maps.DirectionsStatus.OK) {
        directionsRenderer.setDirections(response);
        console.log(i + " " + count);
        callback(response.routes[0].legs[0].distance.value, i, tailMarkers.length - 1);
    } else {
        alert('Error: ' + status);
    }
});

现在，我不想使用JFiddle，因为它会很难写，所以我只想链接到我正在尝试的网站。

http://stud.aitel.hist.no/~anderfy/html5.proj/

如果你看看右下角的复选框，上面写着"vis-min-posisjon"，你只需要点击它，你就会发现问题所在。

代码在文件galled GMap.js的第134行到第142行。我希望我能给你足够的信息！

正是因为这个原因，您不应该在for循环中创建函数。

你的问题在于这个闭包，它共享变量i:

function (response, status) {
    if (status == google.maps.DirectionsStatus.OK) {
        directionsRenderer.setDirections(response);
        console.log(i + " " + count);
        callback(response.routes[0].legs[0].distance.value, i, tailMarkers.length - 1);
    } else {
        alert('Error: ' + status);
    }
}

我会重写该函数，使其不依赖于i，但如果您需要i，则

/*before your for loop */
function createRouter(i){
    return function (response, status) {
        if (status == google.maps.DirectionsStatus.OK) {
            directionsRenderer.setDirections(response);
            console.log(i + " " + count);
            callback(response.routes[0].legs[0].distance.value, i, tailMarkers.length - 1);
        } else {
            alert('Error: ' + status);
        }
    }
};
/* in your for loop */
directionsService.route(request, createRouter(i));
相关文章：