addEventListener는 어떻게 재구성해야합니까?

Question

Google Maps API를 사용하고 있습니다. 마커 배열과 정보 창 배열이 있으며 마커를 클릭하면 해당 정보 창이 표시됩니다. JavaScript 리스너를 존중하도록 이벤트 리스너를 추가해야하는 방법을 이해하는 데 문제가 있습니다. 나는 확실히했습니다

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]); 
    }); 
} 

내 모든 개체가 여기 오기 전에 제대로 초기화됩니다 : 페이지가로드 될 때 호출되는 초기화 (에 포함 모두

(잘못된) 코드) .

클릭 이벤트가 발생할 때까지는 내 정보를 더 이상 볼 수 없습니다. 내가 eventListener가 작동하도록 배열에있는 i 번째 위치의 infoWindow가 i 번째 위치의 마커에 해당하는 위치에서 어떻게해야할까요?

감사합니다.

Answer 1

i 값이 업데이트되었으므로 infoWindows[i]에 더 이상 액세스 할 수 없습니다. 이 문제를 해결하기

.forEach 한가지 방법을 사용하는 것이다 :이 경우

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

각 이벤트 리스너 변수 i가 다른 함수이다. 현재 코드는 매번 동일한 i 변수를 사용하고 모든 이벤트 리스너의 i 변수는 동일합니다. 모든 이벤트 리스너가 i이 최종 값으로 남은 후에 markers[i]이 목록의 마지막 마커를 참조합니다.

대체 솔루션은 this question을 확인하십시오.