1 2 3
A few things to notice here:
- Function multiply does not have a name, such function is called anonymous. However it can be invoked, because we have a handle to it - variable multiply
- There is no type declaration for the parameters a and b. What is more - there is no type checking when you’re invoking the function. Of course - depending on the body of the method (everything between curly brackets) it might or might not work depending on the type of the parameter passed
- If during function invocation you pass less parameters than it is stated in the definition, like so:
it’s not going to end with an error. Parameter b will be assigned value of undefined and whole result will also be undefined.
- If you pass more parameters, any redundant (every parameter but first - assigned to a and second, assigned to b) ones will simply be ignored
- If function does not return any value, returned value will be undefined
- Besides using named arguments (a and b in this example), inside of your function you can always use two additional ones - ‘this’ (depending on the context it might take different values, we will discuss this further in the tutorial) and ‘arguments’ - which is an array containing all of the parameters passed to the function during invocation. This means we could read the values of all of the parameters, even if someone would invoke our multiply function like so:
you still would be able to get hold on of this value, like so:
1 2 3 4 5 6
Of course function multiply does not look like it would save a lot of effort. In fact, it would be much easier to simply write
So for a little more useful example:
1 2 3 4 5 6 7 8 9 10 11 12
The this keyword
As I’ve already mentioned in this post, this might mean different things, depending on the context (who ‘owns’ given function) and so:
- this may refer to Window object, when we define and call function like this:
1 2 3 4 5
- this may refer to the ‘parent’ object where function is defined, take a look at the next example, with object initialization:
1 2 3 4 5 6 7 8 9
- this can change its context when we use bind method, like so:
1 2 3 4 5 6 7 8 9
1 2 3 4 5 6 7 8
If your thought after seeing this code was “Huh? What the hell, this isn’t very impressive” - well, in this case I’m not impressed too, as it seems obvious to me - outerspace was defined on the global (Window object) level - it is not surprising it could be accessed from the scope of the function functionUsingClosure. But the fact this example representes a clousre in action means you’ve most likely already been using closures, you just didn’t know you were.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17
Let’s take a moment, let this code sink… Now - what do you think will happen after this code runs? Let me dissect this code for you - first function that is executed is outerFunction and there’s nothing surprising here. functionScopeDeclared will get a string value assigned, innerFunction function will be declared and defined and then assigned to a letsSaveGoodForLater variable, declared in the global scope. So - no magic at all. What is interesting however - is the answer to question - what will happen when letsSaveGoodForLater(); is executed?
Without knowing the answer my answer would be the following:
- since innerFunction have been assigned to a global variable, it will be visible, so invoking letsSaveGoodForLater(); will execute (rather then throwing exception or giving an error message)
- console.log(globalValue); will log ‘global value’ to the console as this was a global variable
- console.log(tooLateMate); This one would NOT work for sure. How could it?
I obviously know the answers at this point, in case you were thinking in similar manner as I did - I’ve posted my gut feelings here, so you wouldn’t feel like you’re the only stupid person in the world, there’s really plenty of us. Because as it turns out, the output of this program actually is:
1 2 3
Turns out, when function is invoked it runs in the context of the variables with values assigned at the point of the declaration of the function. And this is the beauty of closures.