Given the various ways in which the infamous
this . Three particular functions that have appeared to help are Call, Apply and Bind, and there’s a reason that I list them in that order.
Think of Call as being like saying “I’d like to call something, but I’d like to provide my own context for where it gets called”. This makes a lot of sense when you look at objects and classes. Take the following example:
What we’re doing here is that we’re taking the
toyotaHilux object, which has no
beepHorn() method, and using it as the context for a call to the
beepHorn() method. It’s kind of like saying, “Hey
fordFocus, pretend you’re
toyotaHilux for a second, and then call that great
beepHorn() method of yours”.
In addition to the context we provide to Call, we can also provide some parameters to be passed to the target method, like so:
Think of Apply as being like Call, but with the ability to supply parameters to the target function as an array rather than standard parameters. Otherwise, it’s more or less identical:
Now you may be wondering why the parameters are supplied as an array. The reason for this is that as Apply could be called on a function with no parameters, 2 parameters or even 427 parameters, it makes it much more manageable to pass it an array of parameters instead.
Interestingly, this additional functionality over Call also provides us with another feature: the ability to call functions with an array of parameters. Here’s an example:
As you can see we have a simple addition function which takes 2 parameters. The way we’re calling it however is to use Apply, supplying no context (as there’s no use of
this), and then providing an array of parameters to be passed. Apply then handles converting this array into traditional parameters, and calls the function. I’ve also included an attempt to call the function with the array without using Apply to demonstrate what happens normally.
Now just for completeness sake, you might be wondering how this technique performs if the array of parameters provided is bigger or smaller than the parameters the function is expecting. Well the answer is that if you don’t provide enough parameters, the missing ones will be become
undefined (unless you declare a default value in the function declaration), and if you provide too many it’ll just chop off the excess. Here’s an example:
Now this isn’t necessarily the best way to convert an array to parameters, but it’s a common one you’ll see on coding challengers, and it’s an interesting case of taking something that’s been designed for one purpose, and using it for something completely different.
Think of Bind as being like a re-usable version of Call. You declare a variable, and then bind it to the target function, with an optional target context, and provide some optional parameters, and then you can call it whenever you want.
Let’s first look at an example of binding with a context provided:
As you can see, it’s basically the same as a Call, but re-usable.
Now let’s look at an example of Bind that supplies some parameters:
Finally let’s bring everything together by binding to a function and supplying both context and parameters:
As you can see, the
boundInflateToyotaTyre variable is bound to calling the
inflateTyre method of the
fordFocus object, but using the
Note: I’d be remiss if I didn’t point out that the more helpful use-case for Bind in this example would be to bind without the parameters, so they can be specified at call time, such as in the following example: