JavaScript call() vs apply() vs bind() vs $.proxy()

call-apply-bind-proxy.js

var fn = function(arg1, arg2) {
    var str = '<p>aap ' + this.noot + ' ' + arg1 + ' ' + arg2 + '</p>';
    document.body.innerHTML += str;
};
var context = {
    'noot': 'noot'
};
var args = ['mies', 'wim'];

// Calls a function with a given 'this' value and arguments provided individually.
// Support: everywhere
fn.call(context, args[0], args[1]);

// Calls a function with a given 'this' value and arguments provided as an array
//  (or an array like object).
// Support: everywhere
fn.apply(context, args);

// Creates a new function that, when called, has its 'this' keyword set to the
//  provided value, with a given sequence of arguments preceding any provided
//  when the new function was called.
// Support: ECMAScript >= 5 (thus >= IE9)
var boundFn1 = fn.bind(context, args[0], args[1]);
boundFn1();

// Same as bind()
// Support: same as your jQuery version, available since 1.4
var boundFn2 = $.proxy(fn, context, args[0], args[1]);
boundFn2();

Easy to understand. Thank you.
Probably this is worth mentioning: some arguments can be provided during the actual function call

var boundFn1 = fn.bind(context, args[0]); // Binding only first argument
console.log(boundFn1(args[1]));

Nice Explanataion . Thanks @branneman

Really easy to understand. Thank you.

@VenkataRaju: Correct, but that would be currying & partial application, and I think .bind() is not the right tool for the job when you're currying.

Very Nice Example.
Thanks for sharing.
Keep it up

Nice example, easy to understand and implement.

👍

Great example

Thank you so much! It really helped!

Thanks for an helpful post

Finally I got it, thanks! XD

Merely a note (for me), to map an array of values as arguments:

fn.bind.apply(fn, [context].concat(args))()
fn.bind.apply(fn, Array.prototype.concat.call(context, args))()
fn.bind.apply(fn, args.slice(0).reverse().concat(context).reverse())()

...any other solutions?

Awesome :)

Thx a lot 👍