Question

trying to figure out how to write the following in 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);
    };

};

Unfortunately I can’t figure out for the life of me how in CoffeeScript I access the class pointer, “this” is obviously not context aware and will often just point to the variable passed by the callee. So there’s no way for me to write the above script in CoffeeScript.

Any advice? I can’t find anything useful in the documentation, you have the @ pointers but they also just use the “this” pointer from the current context, making it useless..

Answer 1

You can add methods directly to @ in the constructor to achieve the same effect:

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/ambiguous/Y8ZBe/

You’d usually be able to use a bound method and an “event” argument in situations like this though:

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' }

This sort of thing usually turns up in jQuery (or similar) callbacks and they usually have an event argument which explicitly identifies the target “this” so that you can use bound functions.

Demo: http://jsfiddle.net/ambiguous/LafV2/