Last time reading, I got an understanding of what the differences in functions’ contexts are, depending on the different ways of invocation. I understood that the context is referable via this but only after today’s playing with assertions of these contexts for a bit, the topic sank in deeper. I admire the JS ninja book’s basic examples.

A memorizer for my future self (I have to admit, that I started to look up in my own blogposts when I forgot some detail again), function invocation as a method looks like this:

var myObject = {};
  myObject.whatever = function(){
  return this;
};
myObject.whatever();

##Same function - different contexts

The following are little code examples, which invoke the same simple function in various ways. The assertions are all passing to green proving that the different invocations create different contexts.


// Declaring a named function which returns it's own context:
function creep () {
  return this;
};

// The assertion invokes creep as simple function
// and proves that it's context is the window:
assert(creep() === window, 'Creeping in the window');


// Defining the before defined function creep as
// a variable with a different name
var sneak = creep;

// The assertion invokes sneak which invokes
// creep in return and also proves that it's context is the window:
assert(sneak() === window, 'Creeping in the window');


// Creating an object ninja1 with the property skull, which
// references to the creep function, making skulk a method of ninja1:
var ninja1 = {
  skulk: creep
};

// Asserting that using the created skull method of ninja1,
// also calls creep, but now in the context of the ninja1
// object it is referring to:
assert(ninja1.skulk() === ninja1, 'Ninja1 is the context now');

// A second object ninja2, also with a method skulk as above,
// referencing to the creep function:
var ninja2 = {
  skulk: creep
};

// And then the context of the resulting function call is
// the ninja2 object's context:
assert(ninja2.skulk() === ninja2, 'Ninja2 is the context now');

Screenshot of what the assertions look like in green

The crucial and cool and useful point of this all is that, without having to repeat any code, you can use a function in totally different contexts, applying it to different worlds so to say.
Even though I might not get the whole beauty of what you can do with that yet, I get that this is something like a LEGO effect. You can use the same building blocks to create totally different worlds. Nice. I remember that feeling of creative power.

##Using apply and call for function invocation

These two little fellas are somewhat special. It is two methods, that exist for all functions. When used on a function, two parameters are passed along explicitly: the object to be used as the function’s context and some values to be used as that invocations arguments (in form of an array for apply and just like that for call).

These can be used to force a specific context to be set for callback functions.

And, surprise surprise, they will be dealt with next time.