Question

I’m barely starting JavaScript and I’m wondering if there are any geniuses out there that can help me understand this line by line?

1:  Function.prototype.bind = function(){
2:   var fn = this, 
3:      args = Array.prototype.slice.call(arguments), 
4:      object = args.shift();
5:   return function(){
6:   return fn.apply(object,
7:      args.concat(Array.prototype.slice.call(arguments)));
8:  };
9: };

I’m just beginner, but if you can teach me, then you’re awesome. I know about prototypes, call, shift, apply a bit so you can skip the beginner parts (though I think you shouldn’t so other who are barely getting into JS may learn how).

Notice: I know that there’s a somewhat “similar code” asking a similar question here but I’m asking line by line explanation and they’re not (not duplicate) (also, you can skip line 8 & 9) 🙂

Answer 1

This is a partial implementation, in EcmaScript 3, of the EcmaScript 5 bind method which does partial application. It makes

myObject.method.bind(myObject, 1, 2)(3, 4)

is equivalent to

myObject.method(1, 2, 3, 4)

but its also more convenient because you can do

var m = myObject.method.bind(myObject, 1, 2);
m(3, 4);
m(5, 6);

instead of

myObject.method(1, 2, 3, 4);
myObject.method(1, 2, 5, 6);

Nit: The two are not entirely equivalent, because if the first call to myObject.method does this.method = somethingElse; then the bound method would still call the original.

To break it down:

Function.prototype.bind = function(){

Adds a method to the builtin function type.

var fn = this, 

Stores this which should be a Function in normal use so that it can be used inside a closure.

args = Array.prototype.slice.call(arguments), 

Creates an array containing the arguments to bind.

  object = args.shift();

Removes the first argument from args and stores it in object. This will be used as the this value for fn when it is applied later.

 return function(){

returns a function that acts as a partially applied method. This function when called

return fn.apply(object,

calls the function to the left of .bind passing the first argument to bind as this.
apply is a special reflective method of functions which allows calling of a function with an array of arguments similar to *args or **kwargs in python, or ... in Java.

  args.concat(Array.prototype.slice.call(arguments)));

passes as arguments to fn, the arguments to bind followed by the argument to the closure.