I'm reading through the jQuery UI source code (ui-dialog specifically), I see this pattern repeated many times:

    var self = this,
        options = self.options,
        uiDialog = self.uiDialog;

What's the reasoning behind this pattern of, var self = this, something, something else

I'm reading through the jQuery UI source code (ui-dialog specifically), I see this pattern repeated many times:

    var self = this,
        options = self.options,
        uiDialog = self.uiDialog;

What's the reasoning behind this pattern of, var self = this, something, something else

• javascript
• jquery
• jquery-ui
• jquery-plugins

Share Improve this question Follow edited Jan 19, 2011 at 21:03 jAndy 236k5757 gold badges313313 silver badges363363 bronze badges asked Jan 19, 2011 at 20:56 SooDesuNeSooDesuNe 10k1010 gold badges6161 silver badges9393 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 8

it's just caching variables && obect propertys. This in general is considered as very good practice since object lookups e with a cost.

window.href

takes much more time than

var myhref = window.href;
myhref;

Of course you need to make the expensive call once, but all further calls to the cached variable are much much faster.

Another reason for using this pattern is to cache DOM node references for pretty much the same reasons. Accessing the DOM is one of the most expensive things you can do in Javascript (in a browser). So by caching references you just boost your code.

Assigning self helps with scope problems — the meaning of this might change throughout the script, self will always stay the reference to the instance. Common other forms are that and base.

The ma allows to write var only once in front of the variable definitions.

var self = this,
    options = self.options,
    uiDialog = self.uiDialog;

is the same as

var self = this;
var options = self.options;
var uiDialog = self.uiDialog;