The difference between apply,call,bind

Apply and call

In JS, Apply,call,bind is in order to change the execution context of the function, that is, to change the function inside this point.

The following examples illustrate why we use apply and call, and the difference between apply and call.

function person () {};
Person.prototype = {
Name: ' John ',
Sayname:function (type) {
Console.log (THIS.name + "" + type);
}
}
var Testperson = new Person ();

var lily = {name: ' Lily '};

Testperson. Sayname (' prototype '); John prototype

Testperson. Sayname.call (Lily, ' call '); Lily Call

Testperson. sayname.apply (lily,[' Apply '); Lily Apply

The above code outputs the result as shown:

(1) You can see that call and apply are Testperson to change this dynamically. Sayname (' prototype ') does not specify a this, so it is used directly or inside this, while in Testperson. Sayname.call (Lily, ' call ') and Testperson. sayname.apply (lily,[' Apply ') Lily is already on the outside, so the this is used for the Lily object, not the inside of the function. So call and apply are used to change or internal this point.

(2) Note that when you use call and apply, the two methods accept the difference between the parameter methods

Func.call (This, ARGS1, Args2,....)

Func.apply (This, [ARGS1, Args2,...]);

Call is to list all parameters through args, and apply is an array of arguments, so there is no difference between knowing the number of arguments to the function. However, if a function has a variable number of arguments, it is necessary to use apply, through the array of push, the parameters are passed into the array, and then called. When the number of arguments is variable, the array can also be traversed by arguments within the function.

Bind

With regard to bind's usage and apply/call, the explanation on the MDN is that bind () creates a new function called a binding function that, when called, binds the binding function to the first parameter of the bind () method when it is created, passing in bind () The second and subsequent parameters of the method plus the arguments of the binding function itself are invoked in order as parameters of the original function to invoke the original function.

var bar = function () {
Console.log (this.x);
}
var foo = {
X:3
};
Bar (); Undefined, no x is found in the function itself and in all scopes, so the output undefined
var func = Bar.bind (foo);
Func (); 3

After you create a binding function with bind (), the This is set to Foo, not all scopes, when it is executed.

It is also important to note that bind can only be executed once and cannot be executed multiple times

var bar = function (){      console.log( this .x); } var foo = {      x:3 } var sed = {      x:4 } var func = bar.bind(foo).bind(sed); func(); //?   var fiv = {      x:5 } var func = bar.bind(foo).bind(sed).bind(fiv);The above code does not output the expected 4, 5, but output 3, indicating that multiple bind () is invalid. bind/call/apply Differences

function person () {};
Person.prototype = {
Name: ' John ',
Sayname:function (type) {
Console.log (THIS.name + "" + type);
}
}
var Testperson = new Person ();

var lily = {name: ' Lily '};

Testperson. Sayname (' prototype '); John prototype

Testperson. Sayname.call (Lily, ' call '); Lily Call

Testperson. sayname.apply (lily,[' Apply '); Lily Apply

Testperson. sayname.bind (lily,[' bind ')(); Lily Bind

The above code is very easy to find in the use of bind, there is one more (), this () indicates immediate execution

Indicates that bind () does not execute immediately after changing the execution context, and Apply/call is executed immediately.

Summarize:

• Apply, call, and bind are all pointers to the This object that is used to change the function;
• Apply, call, bind the first parameter is the object that this is to point to, that is, the context you want to specify;
• Apply, call, bind three can use the following parameters to pass the parameter;
• Bind is to return the corresponding function, which is convenient to call later; apply, call is called immediately.

The difference between apply,call,bind