Function Context

Functions in JavaScript run in a specific context, and using the this variable we have access to it.

All standard functions in the browser run under the Window context. Functions defined under an object or a class (another function) will use the context of the object it was created in. However, we can also change the context of a function on runtime, both before or while executing the function.

Binding a method to an object

To bind a function to an object and make it an object method, we can use the bind function. Here is a simple example:

var person = {
    name : "John"
};

function printName()
{
    print(this.name);
}

Obviously, we are not able to call printName() without associating the function with the object person. To do this we must create a bound method of the function printName to person, using the following code:

var boundPrintName = printName.bind(person);
boundPrintName();    // prints out "John"

Calling a function with a different context

We can use the call and apply functions to call a function as if it was bound to an object. The difference between the call and apply functions is only by how they receive their arguments - the call function receives the this argument first, and afterwards the arguments of the function, whereas the apply function receives the this argument first, and an array of arguments to pass on to the function as a second argument to the function.

For example, let's call printName with person as the context using the call method:

printName.call(person);      // prints out "John"