They are all prototypes of object Function
where it aims to execute a function passing through it a different context and arguments.
-
call : context, param1, param2, param3, ...
-
apply : context, array of parameters
bind is a little different and newer, not all browsers are supported, it will create a wrapper of your function, resulting in a new function, with context and fixed arguments .
For example:
function foo(nome, idade) { return 'ola '+nome+', você tem '+idade}
var joao = foo.bind(window, 'joao');
joao('23'); // ola joao, você tem 23
joao('26'); // ola joao, você tem 26
// o que é o mesmo que:
var joao = function (idade) {
return foo('joao', idade);
}
// porém evita bastante rescrita no seu código
// mantive o argumento nomeado como 'idade' para fins didaticos o que
// é feito na realidade é não passar argumentos e o segundo argumento em
// foo seria 'arguments[0]' dentro da função anonima do joao que é um wrapper
Returning to the call and apply which are very similar, let's talk about context.
pessoa = {
idade: 10,
bar: function (nome) {
return 'ola '+nome+', vc tem '+this.idade+' anos';
}
};
pessoa2 = {
idade: 20
}
pessoa.bar('joao'); // ola joao, vc tem 10 anos
// Pessoa 2 não tem o método bar, mas podemos usar da pessoa emprestado
pessoa.bar.call(pessoa2, 'joao'); // ola joao, vc tem 20 anos
//ou com apply
pessoa.bar.apply(pessoa2, ['joao']); // ola joao, vc tem 20 anos
Call is very good for carrying arguments from one method to another.
function fazerAlgo(callback, arg1, arg2) {
var args = Array.prototype.splice.call(arguments, 1);
return callback.apply(this, args);
}
fazerAlgo(function (arg1, arg2) {
console.log(arg1);
console.log(arg2);
}, 'foo', 'bar');
// Escreve no console:
// 'foo'
// 'bar'