[JQUERY] (이 바인딩 어휘) ES6 화살표 기능의 jQuery $ (이)를 사용하여

(이 바인딩 어휘) ES6 화살표 기능의 jQuery $ (이)를 사용하여

해결법

1. ---

   1.이 Traceur 함께 할 수 없다 무언가를 해제,이 ES6 작동 단순히 방법이다. 그것은 당신이 사용을 요구하고있는 특정 기능의 => 대신 함수 () {}.

   이 Traceur 함께 할 수 없다 무언가를 해제,이 ES6 작동 단순히 방법이다. 그것은 당신이 사용을 요구하고있는 특정 기능의 => 대신 함수 () {}.

   당신이 ES6를 작성하려는 경우, 당신은 ES6 모든 시간을 쓸 필요가, 당신은으로 전환하고 그것에서 코드의 특정 라인에, 당신은 확실히 방법 => 작품을 변경하지 억제하거나 할 수 없습니다. 비록 당신이 할 수 있다면, 당신은 단지 당신이 이해하고 확실히 Traceur의 점없는 사용자 정의 Traceur, 외부에서 제대로 작동하지 않을 것하는 자바 스크립트의 일부 기괴한 버전으로 바람 것입니다.

   이 특정 문제를 해결하는 방법은 event.currentTarget를 클릭 된 요소에 액세스, 대신 사용하려면이 옵션을 사용하지 않는 것입니다 :

   Class Game {
     foo(){
       this._pads.on('click', (event) => {
         if(this.go) {
           $(event.currentTarget).addClass('active');
         }
       });
     }
   }
   

   jQuery를도 ES6 전에 jQuery를, 즉 콜백 함수 (에이를 부과하는 것은이 바인드를 통해 다른 문맥에 바인드 된 경우, 그것은 항상 가능하지 않다, 특히 때문에 event.currentTarget을 제공합니다.

2. ---

   2.이벤트 바인딩

   이벤트 바인딩

   $button.on('click', (e) => {
       var $this = $(e.currentTarget);
       // ... deal with $this
   });
   

   고리

   Array.prototype.forEach.call($items, (el, index, obj) => {
       var $this = $(el);
       // ... deal with $this
   });
   

3. ---

   3.상단 대답은 정확하고 나는 그것을 투표를했습니다.

   상단 대답은 정확하고 나는 그것을 투표를했습니다.

   그러나, 또 다른 경우가 있습니다 :

   $('jquery-selector').each(() => {
       $(this).click();
   })
   

   로 고정 될 수 있습니다 :

   $('jquery-selector').each((index, element) => {
       $(element).click();
   })
   

   이 대신 첫 번째 인수로 요소의 인덱스를두고 jQuery를에서 역사적 실수 :

   참조 : https://api.jquery.com/each/#each-function

4. ---

   4.(이것은 내가이 질문의 다른 버전에 대한 쓴 답은이 질문의 중복이었다 배우기 전에이다. 나는 커뮤니티 위키로 추가하기로 결정 그래서 상당히 명확 함께 정보를 응답 당긴 생각, 그것은 주로 단지 다르다 있지만, 다른 답변으로 같이 분석.)

   (이것은 내가이 질문의 다른 버전에 대한 쓴 답은이 질문의 중복이었다 배우기 전에이다. 나는 커뮤니티 위키로 추가하기로 결정 그래서 상당히 명확 함께 정보를 응답 당긴 생각, 그것은 주로 단지 다르다 있지만, 다른 답변으로 같이 분석.)

   당신은 할 수 없습니다. 화살표 기능의 절반 지점의 그, ​​그들은 가까운이 아니라 자신의 필요 이상 그들이 호출하고 방법에 의해 설정되어있다. 핸들러를 호출 할 때 jQuery를하여이 설정을 원하는 경우 문제의 사용 사례를 들어, 핸들러 함수의 함수가 될 필요가있다.

   당신은 화살표 (아마도 당신이 화살표 밖에서 무엇을 의미하는지에 대해이 작업을 사용하려면)를 사용하는 이유가있는 경우 같은 당신이 경우에, 당신은 대신의 e.currentTarget을 사용할 수 있습니다 :

   class Game {
     foo(){
       this._pads.on('click', e => {                   // Note the `e` argument
         if(this.go) {
           $(e.currentTarget).addClass('active');      // Using it
         }
       });
     }
   }
   

   이벤트 객체의 currentTarget은 jQuery를 당신의 핸들러를 호출 할 때이 설정됩니다 것과 동일합니다.

5. ---

   5.빈약 한 당신이 ES6를 작성하려는 경우,이 같은 질문에 그의 대답에 말했듯이, 당신이 ES6 모든 시간을 쓸 필요,

   빈약 한 당신이 ES6를 작성하려는 경우,이 같은 질문에 그의 대답에 말했듯이, 당신이 ES6 모든 시간을 쓸 필요,

   당신이 ES6의 화살표 기능을 사용하는 경우 너무 : (이벤트) => {}, 당신은 대신 $ (이)의 $ (event.currentTarget)를 사용합니다.

   당신은 또한 같은 currentTarget를 사용하는 더 친절하고 깨끗한 방법을 사용할 수 있습니다 ({currentTarget}) => {}

   Class Game {
     foo(){
       this._pads.on('click', ({currentTarget}) => {
         if(this.go) {
           $(currentTarget).addClass('active');
         }
       });
     }
   }
   

   원래이 아이디어는 빈약 한의 대답 @에서 RIZZI 솔직한 댓글을 달았습니다, 나는 유용 생각하고 나는이 다른 답변으로 작성했습니다, 그래서 모든 사람들이 그 의견을 읽을 수 없습니다 생각했다.

from https://stackoverflow.com/questions/27670401/using-jquery-this-with-es6-arrow-functions-lexical-this-binding by cc-by-sa and MIT license