javascript this object

Question

I have been working on web project for past 4 months. To optimise the code performance we have used a pattern. My doubt is, does it actually boost performance or not?

when ever we have to use this object we assign it to a local variable, and use that.

function someFunction()
{
  var thisObject = this;
  //use thisObject in all following the code. 
}

the assumption here is that, assigning this object to a local stack variable will boost the performance.

I have not seen this type of coding anywhere so doubt if it is of no use.

EDIT: I know that assigning this object to local variable is done for preserving object, but that is not our case.

Answer 1

As with ALL performance questions, they should be examined by actually measuring the performance. In a rather simple test case (your actual code might vary some), I find mixed results across the browsers:

Chrome and Firefox don't differ very much between the two tests, but the slight difference is in opposite directions between the two. IE9 shows the test using a saved copy of this which I called self to be significantly slower.

Without a significant and consistent performance difference in Chrome and Firefox and IE9 showing the this test case to be substantially faster, I think you can conclude that the design pattern you asked about is not delivering a consistent performance boost across browsers.

In my code, I save a copy of this to another variable only when I need it for a consistent reference to the original object inside of inline event handlers, callbacks or methods where this has been set to something else. In other words, I only apply this design pattern when needed.

In a previous discussion of this design pattern here on SO, it was concluded that some libraries use this design pattern in order to allow additional minimization because this cannot be minified below the four characters that it takes up, but assigning it to a locally variable can be minified to a single character variable name.

Answer 2

Even when this kind of optimization has an (positive) effect, it is very likely to depend on the interpreter.

An other release may revert the results.

However, in the end you should measure, not guess.

Answer 3

While this is a common practice in Javascript it's not done for performance reasons. The saving of the this object in another named local is usually done to preserve the value of this across callbacks which are defined within the function.

function someFunction() {
  var thisObject = this;
  var someCallback = function() {
    console.log(thisObject === this);  // Could print true or false
  };
  return someCallback;
}

Whether or not thisObject === this evaluates to true will depend on how it's called

var o = {} 
o.someFunction = someFunction();
var callback = o.someFunction();
callback();        // prints false
callback.call(o);  // prints true