jQuery .each () 내부의 Coffeescript 'this'

jQuery .each () 내부의 Coffeescript 'this'

---

다음과 같은 커피 스크립트가 있습니다.

class foo:
    @bar = 'bob loblaw'

    processRows: ->
        $("#my-table>tr").each ->
            id = $(this).attr("id")
            @processRow id

    processRow: (id) ->
        console.log @bar + id

그래서 내 문제는 : 루프 내부 this의 .each컨텍스트 를 참조하여를 가져와야 id하지만 현재는 수행하지 않는 this클래스 인스턴스를 참조하고 싶습니다 foo.processRow().

내부에서 많은 클래스 변수를 참조하기 때문에 함수 _this = this외부 와 같은 것을 사용 .each하고 전달하는 것도 좋은 해결책이 아닙니다 processRow.

이견있는 사람? 나는 명백한 것을 놓치고 있습니까? 감사!

---

jQuery.each당신이하지 않도록, 콜백의 두 번째 매개 변수로 현재의 요소를 전달 해야 예약 thisjQuery를 위해 :

processRows: ->
    $("#my-table>tr").each (index, element) =>
        id = $(element).attr("id")
        @processRow id

의 사용에주의 지방 화살표 ( =>) 구문 콜백 기능을; 함수의 컨텍스트를의 현재 값에 바인딩합니다 this. ( this콜백 함수에서 항상 함수 this를 정의 할 때 와 동일 합니다.)

---

당신은 말한다

processRow 내부에서 많은 클래스 변수를 참조하기 때문에 함수 _this = this외부 와 같은 것을 사용 .each하고 전달하는 것도 좋은 해결책이 아닙니다.

하지만 이것이 가장 효율적인 솔루션입니다. JavaScript this는 이상한 짐승입니다. =>arnaud576875가 그의 대답 (우아하지만 비효율적 임)에서 요청하기 때문에 연산자를 사용하여 중첩 된 함수 내부에 고정 된 상태로 유지 하거나 this다른 변수에 복사 할 수 있습니다 (효율적이지만 우아하지 않음). 선택은 당신의 것입니다.

일부 최신 브라우저 bind는 모든 기능에 대한 메서드를 지원 하므로 CoffeeScript의 =>. 가능한 =>경우 네이티브 bind를 사용할 수 있는 공개 티켓이 있습니다 : https://github.com/jashkenas/coffee-script/pull/1408

부록 : 물론, 위의 어떤 것보다 더 효율적인 대안은 다음과 같이 작성하는 것입니다.

for element, index in $('#my-table>tr')
  ...

그것은 또한 당신의 this문제를 해결할 것 입니다.

---

코드 ...

class foo
    @bar = 'bob loblaw'

    processRows: ->
        $("#my-table>tr").each ->
            id = $(this).attr("id")
            @processRow id

    processRow: (id) ->
        console.log @bar + id

...로 변환됩니다.

var foo;
foo = (function() {
  function foo() {}
  foo.bar = 'bob loblaw';
  foo.prototype.processRows = function() {
    return $("#my-table>tr").each(function() {
      var id;
      id = $(this).attr("id");
      return this.processRow(id);
    });
  };
  foo.prototype.processRow = function(id) {
    return console.log(this.bar + id);
  };
  return foo;
})();

그것은 번역하고있는 현재 문맥에 대해 많은 것을 가정했습니다. 불행히도 jQuery는 컨텍스트를 관리하기 때문에 명시 적이거나 클래스의 this.

덧붙여서, 생성 된 코드에 다른 문제가 있습니다.이 축소 된 사례를 살펴보십시오.

class foo
    @bar = 'bob loblaw'

    getBar: () ->
        @bar

다음으로 변환 :

var foo;
foo = (function() {
  function foo() {}
  foo.bar = 'bob loblaw';
  foo.prototype.getBar = function() {
    return this.bar;
  };
  return foo;
})();

이 코드를 사용하려고 시도한 결과 :

> foo.bar;
"bob loblaw"

> var f = new foo();
undefined

> f.getBar();
undefined

귀하의 코드 @bar는 자체 속성 을 예상하는 것처럼 보이지만 foo함수 의 정적 속성으로 생성되고 있습니다.

참조 URL : https://stackoverflow.com/questions/7261480/coffeescript-this-inside-jquery-each