Tutorial: Bind Function

Bind.md

In the powerful world of JS, you can do a lot of crazy things with Bind/Apply/Call. Here, I can show a small example so that it can be easily understood.

function test1(a, b, c) {
  console.log(Array.prototype.slice.call(arguments));
  // What will this output?
}

function test2(fn) {
  fn();
  // What if we did fn(10000);
}

function main() {
  test2(test1.bind(null, 1, 2, 3));
}

main();

Because of the wonders of bind, what the function is doing is that it remembers the arguments that it was bound to during initalization stage. So in this case test1.bind() will bind 1, 2, 3 as the arguments to pass when it is called.

So what happens when we did fn(1000)? The answer is simple, JS simply pushes that value to the end of the argument array list, so in fact you would get something like:

// console.log(Array.prototype.slice.call(arguments));
[1, 2, 3, 1000]

Neat?