이벤트 핸들러 클로저에서 public 및 private 메서드에 액세스

Question

현재 JavaScript 코드의 작동 방식을 이해하는 데 어려움이 있습니다. 나는 이벤트 핸들러 클로저에서 private object 메소드에 접근 할 때의 문제점을 해결할 수 있었지만, 왜 그렇게 작동하는지 알고 싶다.

(function(module, $, undefined) 
{ 
    function myPrivateCode(e){ /*...*/ } 

    module.myPublicCode = function(e) { /*...*/ } 

    module.init = function() 
    { 
    var that = this; 
    $('.clickable').click(function(e) 
    { 
     if($(e.target).hasClass('classX')) 
     { 
     that.myPublicCode(e.target); // requires 'that' to work 
     } 
     else 
     { 
     // that. 
     myPrivateCode(e.target);  // will fail if 'that' uncommented 
     } 
    }); 
    } 

}(window.module = window.module || {}, jQuery)); 

나도 공공 또는 민간 메소드를 호출 클릭 핸들러를 설정 한 코드에서 :

이 코드는 잘 알려진 모듈/플러그인 은유를 사용합니다. that 로컬 변수에 의해 수행되는 이벤트 핸들러 클로저에 객체 참조를 전달해야한다는 것은 완벽하게 생각할 수 있습니다. 나에게 이상한 점은 myPrivateCode은 참조로 that을 필요로하지 않으며 "개인 정보"로 인해 실패하지 않는다는 것입니다. 이것은 내가 myPrivateCode이 적절한 객체가 아니라고 생각하게하고, 예상되는 방식과 어떻게 든 다르게 작동합니다. 누군가가 어떻게되는지 설명 할 수 있을까요? 확실히 나는 뭔가를 놓치고있다.

미리 감사드립니다.

Answer 1

모두 that 및 myPrivateCode는 closure를 통해 이벤트 핸들러를 사용할 수 있습니다. 즉, 다른 함수의 내부에서 선언 한 모든 변수와 함수가 외부 범위에 액세스 할 수 있다는 것입니다.

myPublicCode은 module 개체에 구체적으로 할당되어 있기 때문에 클로저를 통해 사용할 수 없습니다. 따라서 module.myPublicCode() (또는 –처럼 that.myPublicCode()을 사용하지만 module도 사용할 수 있으므로 실제로는 that이 필요하지 않습니다.)

Answer 2

myPrivateCode(e.target);에 대한 호출이 click 함수에 대한 처리기로 전달되는 익명 함수의 컨텍스트에서 실행 중입니다.

자세한 내용은 closures을 참조하십시오.

간단한 예를 들어,이 코드를 시도 :

var foo = function() { 
    var a = 1; 

    return function (b) { 
     return a+b; 
    } 
}; 

var bar = foo(); 

bar(1); // 2 

bar(1)이는 항상 항상 2를 제공하는 기능을 만들 때 a = 1이 범위에 있었기 때문에. 귀하의 경우 a은 that이고 처리기는 폐쇄 된 기능입니다.

http://jsfiddle.net/Fh8d3/