[JQUERY] 자바 스크립트 클로저에서 루프에서 액세스 외부 변수 [중복]

자바 스크립트 클로저에서 루프에서 액세스 외부 변수 [중복]

해결법

1. ---

   1.여기에이 문제는 변수 항목이 각 루프에 따라 변화한다는 것입니다. 일부 나중에에서 항목을 참조 할 때, 그것은 개최 된 마지막 값이 사용됩니다. 당신은 신속 범위에 변수 다르게 (즉, 반환하는 함수 본질적 기능) 폐쇄라는 기술을 사용할 수 있습니다.

   여기에이 문제는 변수 항목이 각 루프에 따라 변화한다는 것입니다. 일부 나중에에서 항목을 참조 할 때, 그것은 개최 된 마지막 값이 사용됩니다. 당신은 신속 범위에 변수 다르게 (즉, 반환하는 함수 본질적 기능) 폐쇄라는 기술을 사용할 수 있습니다.

       for (var i in this.items) {
               var item = this.items[i];
               $("#showcasenav").append("<li id=\"showcasebutton_"+item.id+"\"><img src=\"/images/showcase/icon-"+item.id+".png\" /></li>");
               $("#showcasebutton_"+item.id).click( 
                   // create an anonymous function that will scope "item"
                   (function(item) {
                      // that returns our function 
                      return function() {
                       alert(item.id);
                       self.switchto(item.id);
                      };
                   })(item) // immediately call it with "item"
               );
       }
   

   사이드 노트 - 당신이 여기에 jQuery를 가지고 참조하십시오. 이 배열에서 사용할 수있는 도우미 함수 $의 .each ()를 가지고 있으며, 대한 / 각 루프 간단한에 대한 바로 가기가 될 수 있습니다. 방식이 호출의 범위 지정 작품 때문에 - "항목은"이미 호출 된 함수의 매개 변수입니다 때문에 당신이 클로저를 사용할 필요가 습관에 사실처럼, 부모 함수의 범위에서 VAR에 저장되지 않은 사용자의 예.

   $.each(this.items,function(i, item) {
     $("#showcasenav").append("<li id=\"showcasebutton_"+item.id+"\"><img src=\"/images/showcase/icon-"+item.id+".png\" /></li>");
     $("#showcasebutton_"+item.id).click(function() {
       alert(item.id);
       self.switchto(item.id);
     });
   });
   

2. ---

   2.이 접근하는 또 다른 방법은 함수를 호출하여 확인 = 항목이 [i]는 사업이 효과적으로 수행하는 것입니다. 속기,이 :

   이 접근하는 또 다른 방법은 함수를 호출하여 확인 = 항목이 [i]는 사업이 효과적으로 수행하는 것입니다. 속기,이 :

   for (var i in this.items) {
       (function(item) {
           $("#showcasenav").append("<li id=\"showcasebutton_"+item.id+"\"><img src=\"/images/showcase/icon-"+item.id+".png\" /></li>");
           $("#showcasebutton_"+item.id).click(function() {
               alert(item.id);
               self.switchto(item.id);
           });
       })(this.items[i]);
   }
   

   익명 함수가, 조금 지저분 오히려 바람직 할 목적으로 주변에 그리 익명의 일을 할 수있게하지만, 트릭을 수행합니다.

3. ---

   3.당신의 onclick 핸들러 모두 같은 변수를 사용되도록 자바 스크립트 폐쇄는 자신의 변수에 대한 참조를 저장합니다.

   당신의 onclick 핸들러 모두 같은 변수를 사용되도록 자바 스크립트 폐쇄는 자신의 변수에 대한 참조를 저장합니다.

   이 같은 중간 함수에서 변수를 캡처해야합니다 :

   function buildClickHandler(pageNumber) {
       return function()  {    //Create and return a new function
           alert(item.id);
           self.switchto(item.id);
       }
   }
   

   그런 다음, 다음과 같이 클릭 핸들러를 생성하는 기능을 사용 :

   for (var i in this.items) {
       var item = this.items[i];
       $("#showcasenav").append("<li id=\"showcasebutton_"+item.id+"\"><img src=\"/images/showcase/icon-"+item.id+".png\" /></li>");
   
       $("#showcasebutton_"+item.id).click(buildClickHandler(item));
   }
   

   buildClickHandler를 호출 할 때마다 자신의 변수를 가지고 별도의 폐쇄를 만듭니다.

4. ---

   4.이 루프를 시도

   이 루프를 시도

   for (var i=0; i < this.items.length; i++) {
     this.items[i]
   };
   

5. ---

   5.나는 아주 잘이 이전 게시물 것을 알고 있지만, 내가 그것을 이해 (난 당신이 사용하고 있어야합니다 생각) jQuery를 설계 genious 사람들이 문제에 대한 최적의 솔루션을 만든 것 같다.

   나는 아주 잘이 이전 게시물 것을 알고 있지만, 내가 그것을 이해 (난 당신이 사용하고 있어야합니다 생각) jQuery를 설계 genious 사람들이 문제에 대한 최적의 솔루션을 만든 것 같다.

   라이브러리의 새로운 버전 1.4, 그들은 jQuery.proxy () 함수를 추가했다. 이것은 당신이 효율적으로 호출되는 함수의 컨텍스트 / 범위를 수정할 수 있습니다 - JQuery와 방식으로 수행, 당신이 기술을 사용하여 중지 할 수 있습니다 보장을하는 것까지 엉망 가능성이 있었다.

from https://stackoverflow.com/questions/1331769/access-outside-variable-in-loop-from-javascript-closure by cc-by-sa and MIT license