JavaScript에서 `var that = this;`를 사용하는 이유는 무엇입니까?

'var that = this;' 이해하기 JavaScript

JavaScript에서 'this' 키워드는 현재 개체를 나타냅니다. 'this'를 'var that'에 할당하면 개발자는 'this'가 변경될 수 있는 중첩 함수 내에서도 나중에 액세스할 수 있는 원래 개체 참조에 대한 참조를 유지할 수 있습니다.

다음 코드 조각을 고려하세요.

function Somefunction(){
   var that = this; 
   ... 
}

여기서 'this'를 'that'에 할당하면 'Somefunction' 범위 내에서 'that'이 항상 원래 개체 인스턴스를 참조하도록 보장됩니다. 이는 중첩 함수 호출 후 'this' 참조가 변경될 수 있는 클로저 또는 이벤트 핸들러로 작업할 때 유용합니다.

설명하기 위해 요소에서 '클릭' 이벤트를 수신하는 함수가 있다고 가정해 보겠습니다.

var colours = ['red', 'green', 'blue'];
document.getElementById('element').addEventListener('click', function() {
    // this is a reference to the element clicked on

    var that = this;

    colours.forEach(function() {
        // this is undefined
        // that is a reference to the element clicked on
    });
});

이벤트 핸들러 내에서 'this'는 클릭된 요소를 참조하지만 내부 'forEach' 함수 내에서는 'this'가 정의되지 않습니다. 별칭을 'that'으로 지정하면 클릭한 요소에 대한 원래 참조에 계속 액세스할 수 있습니다.

결론적으로 'var that = this;' 현재 개체에 대한 일관된 참조가 유지되도록 보장하므로 'this'가 동적으로 변경될 수 있는 이벤트 처리 또는 종료 시나리오에 특히 유용합니다. 그러나 명확성을 위해 'clickedEl' 또는 'currentElement'와 같이 보다 설명적인 별칭을 사용하여 코드 의도를 더욱 명확하게 만드는 것이 좋습니다.

위 내용은 JavaScript에서 `var that = this;`를 사용하는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!