Call (), apply () and bind () in javascript:

About call () and apply ():

In JavaScript, each function has call and apply (), both of which are used to change the direction of this in the function body and to invoke the relevant parameters.

See an example:

Defines a animal object that has a jump () method:

var animal = {       type: ' Animal ',       jump:function (name) {              return this.type + ' is ' + name;       }} Some_animal.jump (' dog '); * * "Animal is dog" * *

If this time there is an object Other_animal object, there is only one type attribute:

var other_animal = {       type: ' Other animal '}

In this case, the jump () method of the animal is also called, and call () in the jump () function can be used.

One_animal.jump.call (Other_animal, ' cat '). * * "Other animal is cat" * *

When the jump is called, the This is set as a reference to the Other_animal object, so This.type returns the other animal.

When there are multiple parameters,

One_animal.method.call (Other_animal, ' cat ', ' mouse ').

Apply () is basically the same as call () and the only difference is the way the parameters are passed.

Apply () passes an array.

As the next two lines are equivalent:

One_animal.method.call (Other_animal, ' cat ', ' mouse '). One_animal.method.call (other_animal,[' cat ', ' mouse ').

Share a topic:

Define a log method so that it can proxy the Console.log method.

Common solutions:

function log (msg) {    console.log (msg);} Log (1); 1log (up to); 1

The above method is invalidated when the incoming parameter is indeterminate. You can consider using apply () or call (), where the number of arguments is indeterminate, and apply () is better.

function log () {    console.log.apply (console, arguments);}; Log (1); 1log (up to); 1 2

About Bind ():

The use of bind () is similar to the use of call () with apply (), which changes the direction of this in the function body.

The explanation for the MDN is that the bind () method creates a new function. When this new function is called, the first parameter of bind () will be the this when it runs, and then a sequence parameter will pass in as its argument before the passed argument.

this.x = 9;var module = {  x:81,  getx:function () {return this.x;}; Module.getx ();//Return to bayi var Retrievex = MoD Ule.getx;retrievex (); Returns 9, in this case, "this" points to the global scope//creates a new function that binds "this" to the Module object///The Novice may be fooled by the global x variable and the attribute x in module = var boundgetx = Retrievex.bind (module); Boundgetx (); Returns 81

In common monomer patterns, this is usually saved using _this,that,self and so on, in order to continue to use them after changing the context.

var func = {num:1,event:function () {var that = this;$ ('. class '). Click (function () {console.log (that,num);               })       }} Use Bind () to change this:var func = {num:1,event:function () {$ ('. class '). Click (function () {console.log (this,num);}. Bind (This))}}

Here, when Click is called, this is set to the value passed in. When the callback function executes, this points to the Func object.

More Example:var method = function () {              console.log (this.x);} Method ();//undefinedvar Method_func = Method.bind (func); Method_func ();

Attention:

It is not valid to use BIND () multiple times in JavaScript.

The reason is that the implementation of BIND () is equivalent to wrapping a call/apply inside the function, and the second bind () is equivalent to wrapping the bind () again, so it is invalid.

Compare apply, call, bind:

var method = {X:3,};var func= {getx:function () {return this.x;}} Console.log (Func.getX.bind (method) ()); 3console.log (Func.getX.call (method)); 3console.log (Func.getX.apply (method)); 3

Call (), apply () and bind () in javascript: