Why is apply not already bound to functions in Javascript?
apply, bind, javascript, prototype
Solution
why do I have to bind the push method to apply?
It's the other way round: You have to bind the apply method to the Array push function - you can bind it to other functions as well! Otherwise `apply` doesn't know which method to apply with the arguments.
`Function.prototype.apply.bind(Array.prototype.push);` does call the `bind` function on the `apply` function with `push` as the argument, the argument on which `apply` is then bound. The resulting function `pushAll` will, when called, invoke `apply` on the `push` function, and pass it's argument (the array and the arguments array) to it.
Shouldn't Array.prototype.push.apply already be bound to apply?
Nope. JavaScript is designed to bind the context at the call of a function, not already when it's being referred to as a property - there is no implicit binding on property access. Otherwise `Array.prototype.push` would already be bound to `Array.prototype`, before you could call any Function methods like bind/apply on it and try to use it with a different context.
Why does calling it under a different name result in calling it on an unbound context?
It's not so much different name, but different style. (Unbound) Functions do get their `this` value set to the object when they are called as a method on it, i.e. when the reference to the called function is a property access: `destination.push()`.
This allows for great flexibility, you can "borrow" functions from an object and call them on other objects, still being the same (unbound) function. This is rather impossible in languages where function objects are no first-class objects.
If functions (even though they were meant to be methods) are called as plain functions (`pushAll()`), their `this` value will be `undefined` (unless in sloppy mode). Read more on the `this` keyword at MDN.
Problem
Assume, for the sake of this question, that I want to be able to create a function in Javascript that appends all of the elements of one array to another array. One way to achieve this, if you have access to the destination array, is to say: ``` var destination = [1,2,3]; var source = [4,5]; Array.prototype.push.apply(destination, source); console.log(destination); // [1,2,3,4,5] ``` Now, since Array.prototype.push.apply is pretty ugly, I want to alias it to something nicer, like: ``` var pushAll = Array.prototype.push.apply; ``` Which I should be able to call with two arguments, the context (destination) and an array of arguments (source). However, when I try to use the alias, this happens: ``` pushAll(destination, [6,7]); TypeError: Function.prototype.apply was called on [object global], which is a object and not a function ``` So clearly the `apply` function is not bound to `push`, which led me to try this: ``` var pushAll = Function.prototype.apply.bind(Array.prototype.push); pushAll(destination, [6,7]); console.log(destination); // [1,2,3,4,5,6,7,8] ``` Which clearly works fine. My question is, why do I have to bind the push method to apply? Shouldn't Array.prototype.push.apply already be bound to apply? Why does calling it under a different name result in calling it on an unbound context?