Use .bind() when you want that function to later be called with a certain context, useful in events. Use .call() or .apply() when you want to invoke the function immediately, with modification of the context.
call() const findArea = {
pi: 3.14,
area: function (r) {
return this.pi * r * r;
}
}
findArea.area(2); // => 12.56
// Instead of using pi 3.14, you want to use 3.14159.
findArea.area.call({pi: 3.14159}, 2); // => 12.56636
apply()This is similar to call() except it’s accepting array.
const cylinder = {
pi: 3.14,
volume: function (r, h) {
return this.pi * r * r * h;
}
}
cylinder.volume.apply({pi: 3.14159}, [2, 6]); // => 75.39815999999999
// call() invoke like this
cylinder.volume.call({pi: 3.14159}, 2, 6); // => 75.39815999999999
bind()Bind attaches a brand new this to a given function. In bind’s case, the function is not executed instantly like Call or Apply.
//this is not a instant call
const newVol = cylinder.volume.bind({pi: 3.14159});
newVol(2, 6); // => 75.39815999999999