-
-
Save airbr/7a1b0c953e93146a67bfeea01e4b7e10 to your computer and use it in GitHub Desktop.
Revisions
-
jashmenn revised this gist
Oct 29, 2015 . 1 changed file with 3 additions and 2 deletions.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -1,6 +1,7 @@ ### The Problem In Javascript `this` is bound in unexpected ways. Functions, in particular, create a new 'this' and so when you want to keep a reference to an "outer" object you sometimes see the pattern: `var self = this;` as in: @@ -68,4 +69,4 @@ function foo() { Of course, because this is a matter of style the issue of "mental accounting" will differ from person to person. But to me, given the semtanics of Javascript's `this`, I think that `self = this` is easy to comprehend when you have nested callbacks. ### See Also * [Mythical Methods](http://blog.niftysnippets.org/2008/03/mythical-methods.html) - See [this key phrase specifically](http://genius.com/8072071/blog.niftysnippets.org/2008/03/mythical-methods.html) -
jashmenn revised this gist
Oct 29, 2015 . 1 changed file with 4 additions and 1 deletion.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -65,4 +65,7 @@ function foo() { } ``` Of course, because this is a matter of style the issue of "mental accounting" will differ from person to person. But to me, given the semtanics of Javascript's `this`, I think that `self = this` is easy to comprehend when you have nested callbacks. ### See Also * [Mythical Methods](http://blog.niftysnippets.org/2008/03/mythical-methods.html) -
jashmenn revised this gist
Oct 27, 2015 . 1 changed file with 2 additions and 0 deletions.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -64,3 +64,5 @@ function foo() { }) } ``` Of course, because this is a matter of style the issue of "mental accounting" will differ from person to person. But to me, given the semtanics of Javascript's `this`, I think that `self = this` is easy to comprehend when you have nested callbacks. -
jashmenn revised this gist
Oct 27, 2015 . 1 changed file with 49 additions and 2 deletions.There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -1,3 +1,5 @@ ### The Problem In Javascript `this` is bound to the current function so when you want to keep a reference to an "outer" object you see the pattern: `var self = this;` @@ -10,10 +12,55 @@ return function(whatever) { } ``` Is this a good pattern? Shouldn't we just use `.bind(this)` on the inner function? ### Sources Say: I've done some reasearch and here are a few links that discuss this idea along with a little summary of what they suggest. * [Is var self = this; a bad pattern?](http://stackoverflow.com/questions/4371333/is-var-self-this-a-bad-pattern) * Do what feels right * [What underlies this JavaScript idiom: var self = this?](http://stackoverflow.com/questions/962033/what-underlies-this-javascript-idiom-var-self-this) * Find to do, but could be dangerous because there is a `window.self` - see also: [Window.self](https://developer.mozilla.org/en-US/docs/Web/API/Window/self) * [Getting Out of Binding Situations in JavaScript](http://alistapart.com/article/getoutbindingsituations) * Tutorial on binding-sensitive code patterns, using `call` and `apply` and why `.bind` was created * [var self = lame](http://ngauthier.com/2012/04/var-self-equals-lame.html) * This fellow doesn't care for the idiom, but I don't find his arguments convincing * [self = this](http://blog.iangilman.com/2015/02/self-this.html) * Explains the `self = this` pattern but doesn't really suggest pros and cons * [Understanding JavaScript’s Function.prototype.bind](http://www.smashingmagazine.com/2014/01/understanding-javascript-function-prototype-bind/) * Says `self = this` is fine, but explains how `.bind` works and why to use it * [Using var self = this or .bind(this)?](http://codereview.stackexchange.com/questions/49872/using-var-self-this-or-bindthis) * Provides a good list of pros and cons to using `.bind` * Tweets: * Ohhhh I would do anything for scope, but I won't do that = this — [Jake Archibald (@jaffathecake) February 20, 2013](https://twitter.com/jaffathecake/statuses/304163675810439168) * @benhowdle $this for jQuery, for plain JS i don't, use .bind() — [Sindre Sorhus (@sindresorhus) February 22, 2013](https://twitter.com/sindresorhus/statuses/304917599484010496) ### Summary To me, it seems that `.bind` definitely has it's place. For instance when you have a function in a variable and you want to attach it to a particular `this`. That said, in the case of nested anonymous functions I think that using `var self = this;` is straightforward and requires less mental accounting vs. using `.bind`. For example, say we have two nested functions: ```javascript function foo() { return (function() { doSomething((function() { return this.name; // what is `this` again? }).bind(this)); }).bind(this); } ``` vs. ```javascript function foo() { var self = this; return (function() { doSomething((function() { return self.name; // `self` is easy to know because its defined }) }) } ``` -
jashmenn created this gist
Oct 27, 2015 .There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode charactersOriginal file line number Diff line number Diff line change @@ -0,0 +1,19 @@ In Javascript `this` is bound to the current function so when you want to keep a reference to an "outer" object you see the pattern: `var self = this;` as in: ```javascript var self = this; return function(whatever) { return self.foo(whatever); // `this` here is for the inner function } ``` * [Is var self = this; a bad pattern?](http://stackoverflow.com/questions/4371333/is-var-self-this-a-bad-pattern) * Do what feels right * [What underlies this JavaScript idiom: var self = this?](http://stackoverflow.com/questions/962033/what-underlies-this-javascript-idiom-var-self-this) * Find to do, but could be dangerous because there is a `window.self` - see also: [Window.self](https://developer.mozilla.org/en-US/docs/Web/API/Window/self) * [Getting Out of Binding Situations in JavaScript](http://alistapart.com/article/getoutbindingsituations) * Awesome tutorial on how `.bind` works *