Javascript Closure And The This Object

I thought I had a reasonable understanding of the this object in JavaScript. When dealing with objects, callbacks, and both events and handlers, I haven't had a problem with it sin

Solution 1:

As soon as you call:

returnfunc(par);

You're creating a new scope (with its own this) and in this case because you haven't specified an object, this === window usually or undefined in strict mode. The called function does not inherit whatever this was in the calling scope.

Ways to set a value for this are:

myobj.func(par);  // this === myobj

or

func.call(myobj, ...)  // this === myobj

There are also:

• apply
• bind
• arrow functions, where this is set to the same value as the outer execution context (also see MDN:Arrow functions )

Solution 2:

The value of this depends only on whether you call the function as a method or as a function.

If you call it as a method, this will be the object that the method belongs to:

obj.myFunction();

If you call it as a function, this will be the window object:

myFunction();

Note that even if you are in a method that belongs to an object, you still have to call other methods in the object using the method syntax, otherwise they will be called as functions:

this.myOtherFunction();

If you put a method reference in a variable, you will detach it from the object, and it will be called as a function:

var f = obj.myFunction;
f();

The call and apply methods are used to call a function as a method even if it's not a method in the object (or if it's a method in a different object):

myFunction.call(obj);