CoffeeScript: Как использовать как жирную стрелу, так и это?

У меня есть класс coffeescript, в котором есть некоторые прослушиватели событий jquery. Я бы хотел использовать стрелку жира =>, чтобы избежать необходимости ссылаться на класс, но мне все еще нужна ссылка на элемент, который обычно используется с this. Как я могу использовать оба?

class PostForm
    constructor: ->
        $('ul.tabs li').on 'click', =>
            tab = $(this)
            @highlight_tab(tab)
            @set_post_type(tab.attr('data-id'))

    highlight_tab: (tab)->
        tab.addClass 'active'

    set_post_type: (id) ->
        $('#post_type_id').val(id)

Ответы

Ответ 1

CoffeeScript связывает как this, так и @ с внешним контекстом, поэтому вы не можете получить доступ к контексту, предоставленному jQuery (так называемый желаемый "this"). Вместо этого используйте event.target:

class PostForm
    constructor: ->
        $('ul.tabs li').on 'click', (event) =>
            tab = $(event.target)
            @highlight_tab(tab)

Ответ 2

Использование evt.currentTarget

Вероятно, вы должны использовать evt.currentTarget (что эквивалентно this) вместо evt.target (а это не так). Если node, который вы используете для уведомлений click, имеет дочерние узлы, evt.target может быть одним из этих дочерних узлов вместо node, вы добавили обработчик click.

См. http://codepen.io/ddopson/pen/erLiv для демонстрации этого поведения. (щелкните на внутреннем красном поле, чтобы увидеть, что currentTarget указывает на красный div, а target указывает на внешний синий div, на который зарегистрирован обработчик событий)

$('ul.tabs li').on 'click', (event) =>
  tab = $(event.currentTarget)
  @highlight_tab(tab)

Отвечайте на заданный вопрос - получив оба `= > ` и `this`:

Вы можете сделать следующее...

$('ul.tabs li').on 'click', (event) =>
  tab = $(` this `)     # MAKE SURE TO ADD THE SPACES AROUND `this`
  @highlight_tab(tab)

Пространства критически важны, поскольку они не позволяют кофеу измельчать this в _this.

Использование `self` и` → `

В качестве альтернативы сделайте следующее...

self = this
$('ul.tabs li').on 'click', (event) ->
  tab = $(this)
  self.highlight_tab(tab)

Это похоже на ответ CQQL, за исключением того, что я предпочитаю идиоматическое использование self в качестве имени переменной; my правила подсветки синтаксиса VIM цвет self как "специальная" переменная так же, как и для this, arguments или prototype.

Ответ 3

Я предпочитаю эту версию, потому что я могу понять ее легче.

class PostForm
    constructor: ->
        post_form = this

        $('ul.tabs li').on 'click', (event) ->
            tab = $(this)
            post_form.highlight_tab(tab)