Javascript 在引用外部作用域变量的循环中声明的函数可能会导致语义混乱。怎么了？

有人能告诉我我的代码有什么问题吗，尤其是“全屏事件”部分。谢谢

JSLint说，“在引用外部作用域变量的循环中声明的函数可能会导致语义混乱。”

函数初始化（）{
var mapProp={
中心：新google.maps.LatLng（45.502808，-73.571486），
};
var-map=[]；
map[0]=新的google.maps.map（document.getElementById（“map1”），mapProp）；
map[1]=新的google.maps.map（document.getElementById（“map2”），mapProp）；
map[2]=新的google.maps.map（document.getElementById（“map3”），mapProp）；
新的google.maps.Marker({
位置：新google.maps.LatLng（45.502808，-73.571486），
地图：地图[0]，标题：“Sunnyvale”
});
新的google.maps.Marker({
位置：新google.maps.LatLng（45.502808，-73.571486），
地图：地图[1]，标题：“桑尼维尔”
});
新的google.maps.Marker({
位置：新google.maps.LatLng（45.502808，-73.571486），
地图：地图[2]，标题：“桑尼维尔”
});
google.maps.event.addDomListener（窗口，“调整大小”，函数（）{
对于（i=0；i<3；i++）{
var center=map[i].getCenter（）；
/*var-bounds=map[i].getBounds（）*/
var zoom=map[i].getZoom（）；
google.maps.event.trigger（map[i]，“resize”）；
/*图[i].fitBounds（bounds）*/
地图[i].设置中心（中）；
google.maps.event.addListenerOnce（映射[i]，'bounds_changed'，函数（事件）{
这个.setZoom（缩放）；
});
}
});
/**全屏活动*/
对于（i=0；i<3；i++）{
var centerChanged=[]；
var zoomChanged=[]；
google.maps.event.addListener（map[i]，'center\u changed'，function（）{
var centerChanged[i]=map[i].getCenter（）；
var zoomChanged[i]=map[i].getZoom（）；
});
$（文档）.on（'webkitfullscreenchange mozfullscreenchange fullscreenchange'，function（）{
映射[i].setCenter（centerChanged[i]）；
google.maps.event.addListenerOnce（映射[i]，'bounds_changed'，函数（事件）{
这个.setZoom（zoomChanged[i]）；
});
});
}
}
google.maps.event.addDomListener（窗口“加载”，初始化）；

---

JSLint说，“在引用外部作用域变量的循环中声明的函数可能会导致语义混乱。”

在循环中，您没有使用

var

声明

i

变量，从而在全局作用域中隐式创建此变量

在您的循环中，i从0开始并迭代，直到它等于3。这意味着，无论何时在循环完成运行后访问i（例如，在侦听器函数中），它都将等于3。您可以在以下代码中看到这一点：

for（变量i=0；i<5；i++）{
setTimeout（函数（）{
控制台日志（i）；
}, 1000);
}

但这不是导致jslint错误的原因。没错，我没有正确读取lint错误。两个for循环都在调用asyc函数。这意味着for变量的循环在回调中是不可预测的。如果您使用现代JavaScript，那么简单的解决方案是将var更改为let。如果不能使用let，可以使用闭包来捕获循环变量。@Keith我在正确使用闭包时遇到困难，你能帮我吗？另请参阅右图！我怎样才能修好它们？（我在闭包方面遇到了困难）@Emilio我更新了答案，说明了如何修复它们。不幸的是，ES6对我的前端用途没有好处。@Emilio用非ES6的答案再次更新了答案它不起作用：(

function initialize() {
    var mapProp = {
        center: new google.maps.LatLng(45.502808, -73.571486),
    };
    var map = [];
    map[0] = new google.maps.Map(document.getElementById("map1"), mapProp);
    map[1] = new google.maps.Map(document.getElementById("map2"), mapProp);
    map[2] = new google.maps.Map(document.getElementById("map3"), mapProp);

    new google.maps.Marker({
        position: new google.maps.LatLng(45.502808, -73.571486),
        map: map[0], title: 'Sunnyvale '
    });
    new google.maps.Marker({
        position: new google.maps.LatLng(45.502808, -73.571486),
        map: map[1], title: 'Sunnyvale '
    });
    new google.maps.Marker({
        position: new google.maps.LatLng(45.502808, -73.571486),
        map: map[2], title: 'Sunnyvale '
    });


    google.maps.event.addDomListener(window, "resize", function () {
        for (i = 0; i < 3; i++) {
            var center = map[i].getCenter();
            /*var bounds = map[i].getBounds();*/
            var zoom = map[i].getZoom();
            google.maps.event.trigger(map[i], "resize");
            /*map[i].fitBounds(bounds);*/
            map[i].setCenter(center);
            google.maps.event.addListenerOnce(map[i], 'bounds_changed', function(event) {
                this.setZoom(zoom);
            });
        }

    });

    /** Full Screen event */

    for (i = 0; i < 3; i++) {
        var centerChanged = [];
        var zoomChanged = [];
        google.maps.event.addListener(map[i], 'center_changed', function() {

            var centerChanged[i] = map[i].getCenter();
            var zoomChanged[i] = map[i].getZoom();
        });
        $(document).on('webkitfullscreenchange mozfullscreenchange fullscreenchange', function() {
            map[i].setCenter(centerChanged[i]);
            google.maps.event.addListenerOnce(map[i], 'bounds_changed', function (event) {
                this.setZoom(zoomChanged[i]);
            });
        });
    }

}
google.maps.event.addDomListener(window, 'load', initialize);