Question

所以你可能已经看到了类似的东西，有人在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/~andersfy/html5.proj/

如果您查看右下角的复选框，其中显示“vis min posisjon”，您只需点击它，您就会看到问题。

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

Answer 1

出于这个原因，你不应该在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));

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

1 个答案: