CoffeeScript 中的类指针？

Question

试图弄清楚如何在 CoffeeScript 中编写以下内容：

var foo = new function()
{

    var $this = this;

    $("#foo").click( this.clicked );

    this.clicked = function()
    {
        $this.alert( $(this).text() );
    };

    this.alert = function(message)
    {
        alert(message);
    };

};

不幸的是，我一生都无法弄清楚如何在 CoffeeScript 中访问类指针，“this”显然不是上下文感知的，并且通常只会指向传递的变量由被叫方。所以我没有办法用 CoffeeScript 编写上面的脚本。

有什么建议吗？我在文档中找不到任何有用的东西，你有 @ 指针，但它们也只是使用当前上下文中的“this”指针，使其毫无用处。

Answer 1

您可以在构造函数中直接向 @ 添加方法来达到相同的效果：

class C
    constructor: ->
        $this = @
        @clicked = ->
            console.log @
            $this.alert 'pancakes'
    alert: (m) ->
        console.log m

c = new C
c.clicked()
c.clicked.call window​​​​​

Demo: http ://jsfiddle.net/ambigously/Y8ZBe/

你通常可以使用绑定方法和一个不过，在这样的情况下，“事件”参数：

class C
    clicked: (ev) =>
        @alert(ev.target.value)
    alert: (m) ->
        console.log m

c = new C
c.clicked(target: { value: 'pancakes' })
c.clicked.call window, target: { value: 'pancakes' }

这种事情通常出现在 jQuery（或类似）回调中，并且它们通常有一个事件参数，它显式标识目标“this”，以便您可以使用绑定函数。

演示：http://jsfiddle.net/ambigously/LafV2/

Answer 2

CoffeeScript 仍然是 javascript。 this 的限制仍然适用。显然你可以直接写一个翻译：

foo = ->
    self = this
    @clicked = ->
        self.alert $(this).text()
    @alert = (message) ->
        alert message
    $('#foo').click @clicked

然而你应该使用原型（即使是在 javascript 中）。使用粗箭头 => 您可以将函数绑定到它的当前上下文（但随后您会丢失元素引用）：

foo = ->
    $('#foo').click (e) =>
        @clicked(e.target)

foo::clicked = (el) ->
    @alert $(el).text()

foo::alert = (message) ->
    alert message

或者使用 class 抽象（只不过是原型用法包含在一个更漂亮的包中）和 jQuery.proxy：

class Foo
    constructor: ->
        $('#foo').click $.proxy @clicked, this
    clicked: (e) ->
        @alert $(e.target).text()
    alert: (message) ->
        alert message

$.proxy @clicked，在现代浏览器/引擎上，此可以替换为@clicked.bind @（请参阅Function.prototype.bind）。