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)

---

CoffeeScript将

this

和

@

链接到外部上下文，因此您无法访问jQuery提供的上下文（也称为所需的“this”）。改用：

---

我更喜欢这个版本，因为我更容易理解

class PostForm
    constructor: ->
        post_form = this

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

使用evt.currentTarget 您可能应该使用（相当于此）而不是（不是）。如果要点击以获取

单击

通知的节点具有子节点，

evt.target

可能是这些子节点之一，而不是添加

单击

处理程序的节点

有关此行为的演示，请参见。（单击内部红色框查看

currentTarget

指向红色div，而

target

指向事件处理程序注册的外部蓝色div）

回答问题-同时获得“=>”和“this”： 您可以执行以下操作

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

空间非常重要，因为它们可以防止咖啡将

此

咀嚼成

此

使用“self”和“->` 或者，执行以下操作

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

---

这与CQL的答案类似，只是我更喜欢习惯性地使用

self

作为变量名；我的颜色

self

作为一个“特殊”变量，就像它对

此

、

参数

或

原型

一样，您可能希望从函数访问构造函数中设置的变量。这就是您的操作方式（键是通过

self

调用函数，同时首先用细箭头提取

This

）：

顺便说一句：

总结：

您是否在函数中使用此（@）

是否希望稍后执行该函数，可能是从不同的作用域执行

---

你能再描述一下你想做什么吗？你想在哪里使用（这个），上面哪一部分没有按你想要的方式工作？喂，你想把这个

作为什么对象的引用？事件的目标、PostForm类实例等？
event.target
将我们保存在
Backbone.js
以及
event.target中。对于不了解
this
的DOM规则的人来说，target
也不那么容易混淆。请注意，如果使用选择器执行事件，您可能需要evt.currentTarget。看看你在d3上做什么？d3中的回调为您提供了对象（而不是DOM），我不知道您编写它时这是否正确，但event.target有时返回的元素与“this”不同单击事件回调上的“this”返回触发回调的元素，而event.target返回触发单击事件时鼠标所在的元素（通常是某种类型的子元素）self=这正是我所做的。它工作得很好！event.currentTarget实际上与“this”不同，至少对于单击事件的jquery是这样。它有时可能具有相同的值，但也可能没有，这取决于具体情况。”“这”是指被单击的元素，而event.currentTarget返回监视单击事件的元素。@GlyphGryph-感谢您的澄清！如何从类上的另一个函数访问post_表单？类方法通常应该能够使用
this
来引用
PostForm
的当前实例。谢谢@cql:）我详细阐述了我的问题，并给出了我最后得出的答案。最初，我想将回调函数直接交给
单击处理程序，但后来意识到我应该首先将其包装在一个匿名函数中，该函数将获取
此
，并通过
self
将其传递给命名函数，以便充分利用这两个世界。您可以在
突出显示选项卡中访问
@
因为在
self
上调用了
highlight\u选项卡
，而不是因为胖箭头。胖箭没有什么区别。您可以自己编译这两个版本。
$('ul.tabs li').on 'click', (event) =>
  tab = $(` this `)     # MAKE SURE TO ADD THE SPACES AROUND `this`
  @highlight_tab(tab)

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

class PostForm
    constructor: ->
        self = this

        @some_contrived_variable = true

        $('ul.tabs li').on 'click', ->
            tab = $(this)
            self.highlight_tab(tab)
            self.set_post_type(tab.attr('data-id'))

    highlight_tab: (tab) ->
        # Because of the fat arrow here you can now access @ again
        if @some_contrived_variable
            tab.addClass 'active'

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