不要在循环中创建函数/不确定代码的含义[重复]

Question

可能重复：
How to get around the jslint error ‘Don’t make functions within a loop.’

公平的警告，我是一个非常初学者。我正在开发一个 google maps api v3 项目 (http://jsbin.com/ofepet/9/edit)，我在 JSBin 上有一个“不要在循环中创建函数”警告。我想修复它，但我使用的是我在其他地方得到的代码，所以我很难准确理解发生了什么——尤其是最后 7 行。

简而言之，我对代码的理解不够深入，无法将函数从循环中取出。错误出现在倒数第二行。

  function setMarkers(map, markers) {

    for (var i = 0; i < markers.length; i++) {
        var sites = markers[i];
        var siteLatLng = new google.maps.LatLng(sites[1], sites[2]);
        var marker = new google.maps.Marker({
            position: siteLatLng,
            map: map,
            title: sites[0],
            zIndex: sites[3],
            html: sites[4],
            icon: featureImage
        });

        var contentString = "Some content";

        google.maps.event.addListener(marker, "click", function () {
            infowindow.setContent(this.html);
            infowindow.open(map, this);
        });
    }

如何解决这个错误？

Answer 1

警告实际上是准确地说明了它的含义。 :-) 你有一个for 循环，在for 循环中你正在创建一个函数交给addEventListener。这经常（但不总是）是一个错误，这就是它被标记的原因。

在你的情况下，它实际上是无害的——但看起来你可以只对你在循环中创建的所有元素使用一个函数，而不是制作多个。所以：

function setMarkers(map, markers) {

    for (var i = 0; i < markers.length; i++) {
        var sites = markers[i];
        var siteLatLng = new google.maps.LatLng(sites[1], sites[2]);
        var marker = new google.maps.Marker({
            position: siteLatLng,
            map: map,
            title: sites[0],
            zIndex: sites[3],
            html: sites[4],
            icon: featureImage
        });

        var contentString = "Some content";

        google.maps.event.addListener(marker, "click", handler);
    }

    function handler() {
        infowindow.setContent(this.html);
        infowindow.open(map, this);
    }
}

现在您只需为每次调用 setMarkers 创建一个函数并重用它。