Call,Apply,bind() Method

call() method
You can use call()/apply() to invoke the function immediately. bind() returns a bound function that, when executed later, will have the correct context ("this") for calling the original function.So bind() can be used when the function needs to be called later in certain events when it's useful.The function method for manipulating this is call(), which executes the function with a particular this value and with specific parameters. The first parameter of call() is the value to which this should be equal when the function is executed.

function methodName(label) { console.log(label + ":" + this.name); } var person1 = { name: "shubham" }; var person2 = { name: "is my name" }; var name = "testuser"; methodName.call(this, "testuser"); // outputs "testuser" methodName.call(person1, "person1"); // outputs "person1:shubham" methodName.call(person2, "person2"); // outputs "person2:is my name"

In this example, methodName() accepts one parameter that is used as a label to the output value. The function is then called three times. Notice that there are no parentheses after the function name because it is accessed as an object rather than as code to execute.

apply() Method

The apply() method works exactly the same as call() except that it accepts only two parameters: the value for this and an array or array-like object of parameters to pass to the function (that means you can use an arguments object as the second parameter). So, instead of individually naming each parameter using call(), you can easily pass arrays to apply() as the second argument. Otherwise, call() and apply() behave identically. This example shows the apply() method in action

function methodName(label) { console.log(label + ":" + this.name); } var person1 = { name: "shubham" }; var person2 = { name: "testuser1" }; var name = "testuser2"; methodName.apply(this, ["global"]); // outputs "testuser2" methodName.apply(person1, ["person1"]); // outputs "shubham" methodName.apply(person2, ["person2"]); // outputs "testuser1

bind() Method
The third function method for changing this is bind(). This method was added in ECMAScript 5.The first argument to bind() is the this value for the new function. All other arguments represent named parameters that should be permanently set in the new function. You can still pass in any parameters that aren’t permanently set later. The following code shows two examples that use bind(). You create the sayMyDatafor1() function by binding the this value to object1, while sayMyDatafor2() binds this to object2 and binds the first parameter as "object2".

function myData(label) { console.log(label + ":" + this.name); } var object1= { name: "testusername1" }; var object2= { name: "testusername2" }; // create a function just for object1 var sayMyDatafor1 = myData.bind(object1); sayMyDatafor1 ("object1"); // outputs "object1:testusername1" // create a function just for object2 var sayMyDatafor2= myData.bind(object2, "object2"); sayMyDatafor2(); // outputs "object2:testusername2" // attaching a method to an object doesn't change 'this' object2.sayName = sayMyDatafor2; object2.sayName("testusername2");