루프 내부의 함수에 인수를 전달할 때 변수 값을 보존하는 방법은 무엇입니까?

인수를 함수에 전달할 때 변수 값 보존

JavaScript 루프로 작업할 때 변수 값을 보존해야 하는 상황이 발생할 수 있습니다. 변수를 함수에 전달할 때. 이 시나리오는 루프 실행 중에 변수 값이 변경되어 이벤트 리스너에서 예기치 않은 동작이 발생할 수 있을 때 발생합니다.

다음 예를 고려하세요.

<code class="js">for (var i = 0; i < results.length; i++) {
    marker = results[i];
    google.maps.event.addListener(marker, 'click', function() {
        change_selection(i);
    });
}

이 코드에서 이벤트 리스너는 다음과 같습니다. 루프 내의 각 마커에 연결됩니다. 그러나 리스너가 트리거되면 루프가 끝날 때 결과 배열의 길이인 i의 최종 값을 사용합니다. 이 동작은 모든 이벤트 리스너에 대해 동일한 값이 사용되므로 바람직하지 않습니다.

각 리스너에 대한 i 값을 유지하려면 블록 범위 변수(최신 브라우저의 경우) 또는 클로저(에서)를 활용할 수 있습니다. 이전 브라우저).

최신 브라우저(ES6):

<code class="js">for (let i = 0; i < results.length; i++) {
    let marker = results[i];
    google.maps.event.addListener(marker, 'click', () => change_selection(i));
}</code>

let 키워드를 사용하면 루프 내에서만 액세스할 수 있는 블록 범위 변수가 생성됩니다. 이렇게 하면 각 이벤트 리스너가 생성 당시 i 값의 자체 복사본을 갖게 됩니다.

이전 브라우저:

<code class="js">for (var i = 0; i < results.length; i++) {
    (function (i) {
        marker = results[i];
        google.maps.event.addListener(marker, 'click', function() {
            change_selection(i);
        });
    })(i);
}</code>

익명 함수 생성 및 호출 첫 번째 인수로 i를 사용하면 클로저가 생성됩니다. 이 함수는 생성 당시의 i 값을 유지하여 각 이벤트 리스너가 특정 마커에 대해 올바른 값을 사용하도록 보장합니다.

위 내용은 루프 내부의 함수에 인수를 전달할 때 변수 값을 보존하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!