Как мне изменить структуру addEventListener?

Question

Я использую API Google Maps. У меня есть массив маркеров и массив информационных окон, и я пытаюсь получить соответствующее информационное окно для отображения при щелчке маркера. У меня возникли проблемы с пониманием того, как я должен добавить слушателя событий, чтобы он относился к закрытию JavaScript.

(Некорректное) код, все из которых содержится в Initialize(), который вызывается при загрузке страницы:

var markers = [] 
var infoWindows = [] 

[define all markers and info windows here, long so cut] 

for (var i = 0; i < markers.length; i++) 
{ 
    google.maps.event.addListener(markers[i], 'click', function() { 
     infoWindows[i].open(mymap, markers[i]); 
    }); 
} 

я сделал уверен, что все мои объекты инициализируются правильно, прежде чем прийти сюда ,

Мое понимание моей проблемы в том, что к моменту возникновения события щелчка, информацияWindows [i] больше недоступна. Что я могу сделать с этим, чтобы eventListener работал так, как мне кажется, он должен, где infoWindow на i-й позиции в массиве соответствует маркеру на i-й позиции?

спасибо.

Answer 1

Вы правы, infoWindows[i] больше не доступен, потому что значение i было обновлено.

Одним из способов решения этой проблемы является использование .forEach:

markers.forEach(function(value, i){ 
    google.maps.event.addListener(markers[i], 'click', function() { 
     infoWindows[i].open(mymap, markers[i]); 
    }); 
}) 

В этом случае переменный я для каждого слушателя событий в другой функции. Ваш текущий код использует одну и ту же переменную i каждый раз, а переменная i в каждом прослушивателе событий одинакова. После того, как все прослушиватели событий были назначены i остается на своем окончательном значении, а markers[i] ссылается на последний маркер в списке.

Отъезд this question для альтернативных решений.