Use of call, apply and bind in JS

Source: Internet
Author: User
Tags bind

Read a blog today, see such a section of JS code:

var bind = Function.prototype.call.bind (Function.prototype.bind);

I want to suddenly see such a piece of code, even if the JS ability to strong people, may also need to take some time to understand. A rookie like me, let alone. In fact, the original version of the code has been explained, but I still want to use my ideas to explain this code.

The above code involves call and bind, so I'd like to make a distinction between call, apply, and bind. The use of these three methods is very similar, binding the function to the context, which is used to change the point of this in the function. As an example:

var zlw = {  
    name: "ZLW",  
    sayhello:function (age) {  
         console.log ("Hello, I Am", this.name + "+ Age" years Old ");  
     }  
;  
      
var  xlj = {  
    name: "Xlj",  
};  
      
Zlw.sayhello/Hello, I am zlw years old

Here's how to use the call, apply method:

Zlw.sayHello.call (XLJ)/Hello, I am xlj years old

Zlw.sayHello.apply (XLJ, [)]/Hello, I am xlj years old

The results are the same. From the wording we can see the similarities and differences between the two. The same thing is that the first argument is the context to bind, and the subsequent argument is passed to the function that called the method. The difference is that the arguments that the call method passes to the calling function are listed individually, and the apply is written in the array.

Let's take a look at the use of the Bind method:

Zlw.sayHello.bind (XLJ, 24) (); Hello, I am xlj years old

Zlw.sayHello.bind (XLJ, [24]) (); Hello, I am xlj years old

The parameters that the Bind method passes to the calling function can be listed individually or in an array. The biggest difference between the bind method and call and apply is that the former returns a binding context function, and the two functions are executed directly. For this reason, the above code can also write this:

Zlw.sayHello.bind (XLJ) (24); Hello, I am xlj years old

Zlw.sayHello.bind (XLJ) ([24]); Hello, I am xlj years old

The Bind method can also write Fn.bind (obj, arg1) (ARG2).

Summarize the use of bind in one sentence: This method creates a new function, called a binding function, that is used to pass the first argument of the bind method as this when it is created, The second and subsequent parameters of the incoming bind method, along with the parameters of the binding function itself, call the original function in order as arguments to the original function.

Now back to the beginning of the code:

var bind = Function.prototype.call.bind (Function.prototype.bind);

We can understand this code like this:

var bind = Fn.bind (obj)

fn is equivalent to Function.prototype.call and obj is equivalent to Function.prototype.bind. and Fn.bind (obj) can generally write such obj.fn, why? Because the FN binds obj, this in the FN points to obj. We know that the point of this in a function is generally to point to the object that called the function. So that piece of code can be written like this:

var bind = Function.prototype.bind.call;

Back to the column page: http://www.bianceng.cnhttp://www.bianceng.cn/webkf/script/

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.