Hacker News Reader

Comment by statictype | Hacker News Reader

I used to always run into trouble when trying to use 'this' inside a closure defined within an object's method.

Now, I just put

    var that = this;

at the top of very method and use 'that' everywhere in the function.

View on HN

FWIW: that's exactly what ExtJS does:

    initComponent: function() {
        var me = this;
        me.callParent();
        ...

Thanks for explaining the rationale; I'd never paid enough attention to understand why they were doing that.

same here, I use 'this' rarely. always start new function classes with var self = this; and never use 'this' again.

Aha! I also do "var self = this;" but feel really bad about it, like I'm missing something obvious about the language. I guess I'm not.

You're not alone, every time I do this I feel like I'm going wrong somewhere. I know it's avoidable via binding/currying/proxying but often those solutions end up looking uglier and are harder to follow.

I do the same thing with var me.

Another way is jQuery.proxy(), though that works best for calling a method with the correct context.

> Another way is jQuery.proxy()

Or the numerous ``bind`` functions and methods (which do the same thing).

In fact, ES5's Function prototype even grew a ``bind`` method[0], which is used to partially apply a function (both to bind it to a ``this`` and to bind it to an arbitrary number of arguments).

Some libraries (e.g. underscore) also have a shortcut to bind all methods of an object (or only a subset of those)[1], handy when using methods as event or deferred callbacks

[0] https://developer.mozilla.org/en/JavaScript/Reference/Global...

[1] http://documentcloud.github.com/underscore/#bindAll

I just use 'this' as much as possible. It helps me keep track of which object/scope 'this' is referencing. Creating a second reference to the object/scope referenced by 'this' doesn't really change anything.

Something I also find helpful is reminding myself that I'm not just writing a function, but a method for the current object (referenced by 'this').

Yes it does change things. You're not understanding that "this" is a keyword, not a variable reference, and as such, it is not treated the same in closures. The "this" KEYWORD is dynamically bound at runtime, not lexically scoped like every other variable. It is impossible to close over "this", yet it's what you usually want to do. That is why people use ugly work-arounds like "var me = this;". So "this" is a pitfall and language design flaw that traps many JavaScript programmers (even experienced ones) into thinking they're writing correct code that looks like it does one thing, which actually does a totally (and sometimes subtly) different thing.

The article is about 'this', not about creating closures.

I agree that in the case where you're creating a closure, you need to create a reference to the scope referenced by 'this' in order to 'enclose' it, however, that doesn't make it a best practice, all the time, as many responses are suggesting.

I do the same it's really expressive IMHO, it's strange at start but when you understand it it's awesome.

Spot on, I do the same (but I use $this as the variable name).

I use the $ sigil to differentiate between variables that are DOM elements and variables that are jQuery-wrapped DOM elements.

Same here.

     var _this = this;    //vanilla
     var $this = $(this); //jQuery

Though, I have encountered people who are really against the $var for stylistic reasons - so ymmv.

Reply on news.ycombinator.com