작은 폐쇄 대 한 큰 하나의

Question

나는 Google지도가 있고, 나는 다른 것들에 이벤트 리스너를 추가하고있다. 예를 들어, 나는 Point 객체를 가지고 있고,이 목적을 위해, 나뿐만 따라서 이벤트가 추가되었습니다

google.maps.event.addListener(this.marker, 'click', (function(point) { 
    return function(event) { 
     alert(point.index); 
    }})(this)); 

나는이 사건의 많은 ('더블 클릭'을 '오른쪽 클릭하면'을 '클릭'에 대한 하나가 , 등).

이벤트를 추가 할 때 현재 지점 주위에만 클로저를 만듭니다. 그러나 내가하는 유혹은 단지 :

var point = this; 

google.maps.event.addListener(this.marker, 'click', function(event) { 
    alert(point.index); 
}); 

나는 두 가지 이유 때문에 이것을 피하고있다.

하나는 "개별"클로저를 사용하는 것보다 Javascript에 대해 더 많이 알고있는 사람들을 보았 기 때문에 좋은 이유가 있어야한다고 생각합니다.

두 번째 이유는 (그리고 나는 자바 스크립트가 어떻게 해석되는지 알지 못한다.) 큰 클로저를 만들면 내 이벤트 함수 (예 : 'var 색깔'). 이로 인해 성능 문제가 발생할 수 있습니까?

도움 주셔서 감사합니다.

Answer 1

두 예제 모두 point이라는 항목 위에 클로저를 만듭니다. 처음에는 point이 익명의 외부 함수에 대한 매개 변수이고, 두 번째 매개 변수에서는 point이 로컬 변수입니다. 그러나 어느 쪽이든 그것은 궁극적으로 익명의 기능에 의해 폐쇄됩니다.

명명 된 매개 변수 하나를 수락하고 즉시 인수를 사용하여 익명 함수를 만드는 것은 범위 내의 이름에 값을 바인딩하는 한 가지 방법입니다.

(function(x) { 
    // now x has the value 
})(getValue()); 

또는 :

var x = getValue(); 
// now x has the value 

의 차이는 함수를 사용하여, 당신은 x 자신의 네임 스페이스의 삶과이 바깥 쪽 범위의 다른 x과 병합되지 않도록한다는 것이다. 즉,이 값은 실행 속도가 아닌 유지 관리 가능성에 있습니다.

성능이 더 좋을까요? 알아내는 유일한 방법은 여러 브라우저에서 테스트하는 것입니다. 모든 브라우저에는 자체 실행 엔진이 있습니다.

더 많은 익명의 함수가 만들어 질수록 더 작은 할당이 발생한다고 생각하는 것이 합리적입니다. 따라서 익명의 함수가 적은 두 번째 예제가 더 잘 수행 될 수 있습니다.그러나 그것은 당신이 신경 쓰는 모든 브라우저에서 테스트하지 않고도 순수한 근거없는 추측입니다.

Answer 2

포인트가 변경되지 않는 동안 아무런 문제가 없어야합니다. 당신의 포인트가 변경 결합 될 때

var point = this; 

google.maps.event.addListener(this.marker, 'click', function(event) { 
    alert(point.index); 
}); 

는 일반적으로 당신이 당신의 이벤트 처리 기능의 또 다른 폐쇄를 할 것입니다 그리고 당신처럼, 독특한 상태에서 그것을 필요 : 괜찮을 것입니다 그래서 두 번째 예에서와 같이 그것을 할 수 있습니다 예를 들어 루프 : 이벤트는 우리가 배열 포인트의 마지막 요소에 대한 참조를했을 것이다 트리거되었을 때 내 예제에서 우리는 순간에, 폐쇄을 사용하지 않은 것입니다 경우

for(var i = 0, len = points.length; i < len; i++) { 
    google.maps.event.addListener(points[i].marker, 'click', (function(point) { 
    return function(event) { 
     alert(point.index); 
    } 
    })(points[i])); 
} 

.