7 ms·

var self = this; why do people bother with 'this'?

• shabble 14y ago
  because you sometimes want to refer to the original 'this' reference inside an inner nested function scope, where the actual 'this' keyword is rebound to the context of the inner function. function outer() { var outer_this = this; var inner = function() { var inner_this = this; // ... } } http://stackoverflow.com/questions/4886632/what-does-var-that-this-mean-in-javascript http://stackoverflow.com/questions/4886632/what-does-var-tha... has some more details.
  • pixie_ 14y ago
    Of course there are exceptions to the rule, but the rule should still be - avoid 'this.'
• jQueryIsAwesome 14y ago
  For consistency and to avoid populating the scope with named variables, look at how jQuery works for good examples of how to use 'this' (the puns are infinite with this)
• jpolitz 14y ago
  I'm confused... doesn't that just reduce the question to "what is the current binding of self"?
  • jQueryIsAwesome 14y ago
    After assignment "self" does not change even if "this" does. var player = { play: function(){ var self = this; setTimeout(function(){ console.log(self); }); } }
    • marcusf 14y ago
      No but this is still bound at call time, so `self` will be foo in foo.play() just as this, so that's basically the same thing + a standard variable assignment to get the setTimeout working. On a sidenote, I'm trying to get away from using self, and do object.bind in all my setTimeouts. To my mind, it leads to much cleaner code.
      • jQueryIsAwesome 14y ago
        Bind is not supported in IE8 and older versions. You could use the underscore library or another one that haves a cross-browser bind method.
        • marcusf 14y ago
          For my particular use case, IE8 is not an issue, but sure, a shim is like three lines, and we did use that before (when IE8 was an issue).
      • pixie_ 14y ago
        object.bind doesn't look very clean compared to using self.
        • jQueryIsAwesome 14y ago
          And in JS is really easy to create an abstraction for this issue: function wait(o){ return setTimeout(function(){ o.action.call(o.this) },o.delay*1000) } To use it like this: wait({ action : function(){ console.log(this) }, delay : 1, this : this });
          • pixie_ 14y ago
            If you're writing abstractions to avoid bad language features, maybe you shouldn't be using bad language features in the first place.
        • 14y ago
• v413 14y ago
  IMO the use of self as the name of the variable referencing to 'this' is a little dangerous, because in a function, if you miss the line var self = this, self is a valid reference to the window object, so you will not get an expected error for an undefined variable.
  • pixie_ 14y ago
    Better a little dangerous 'self' than a lot of dangerous 'this.'
    • henryzhu 14y ago
      Totally, just remember to use var. Dangerous this is much scary then accidentally adding a global variable.
      • v413 14y ago
        The problem with `self` is that it is already a predefined global variable in the browser pointing to the global object :) And btw, the `this` situation with javascript is not that bad :) use bind - either the Ecmascript 5 version or shimmed and you will be fine. Not much drama.
    • v413 14y ago
      Well you might just use some other name than `self` e.g. I use var _this = this;
    • just2n 14y ago
      There's no real danger difference. If you implicitly do: var self = this; When you need to use `this`, you just end up proxying the problem behind a variable. If you don't understand what `this` is, it's not going to magically start correcting your misunderstanding. The only possible value it might have is when nesting functions if you refer to `self` instead of `this` correctly, but this is the only case when I actually use this pattern, and when I first create a nested function that needs to use the parent's scope. Another option is to just `.bind(this)`. In any case, I would disagree that one should try to avoid `this`. Instead, one should educate themselves to understand what things in the language they're using mean. And this subject is a great weeder question in Web Engineer position interviews. If a person can't implement `bind`, can't explain `call`/`apply`, what strict mode does, and what the `this` keyword means in most contexts, they probably aren't strong enough in JS. This is one of the most fundamental concepts in JS, it shouldn't be a source of confusion.