Shallow solution of Function.prototype.bind method in Prototype.js __js

Source: Internet
Author: User
The first time I saw the Function.prototype.bind = function () {} and Class.create () method in the Prototype.js framework was somewhat incomprehensible, Because Mickey often use jquery without much thought about how these powerful libraries provide us with the easy to use prototype method. So when you see some of the source code for this kind of framework, the ingenious use of some of the underlying classes to extend the prototype method is a prototype.js reason to understand. But Mickey through layers of analysis, paragraph calls, so draw a conclusion, if there are deficiencies please comment.

The Function.prototype.bind method in Prototype.js:

JS Code Function.prototype.bind = Function () {var __method = this;       var args = Array.prototype.slice.call (arguments);       var object=args.shift (); return function () {return __method.apply (object, Args.concat (Array.prototype.slice.call) (argument   s)); }   }

Add a new prototype (prototype) method for all function objects bind:

1. Save the object that calls the Bind method into the __method (method) variable.
2. Converts the arguments passed when the Bind method is invoked to the array to be saved to the variable args.
3. Extract the first bit [0] element of the args array and save it to the variable object.
4. Returns a function.
This returned function performs the following actions when it is called again:

1. Use the Apply method to replace the this pointer in the function that calls the Bind method with object.
2. The parameters passed to this anonymous function are converted to arrays, combined with the args array to form a new array, passed to the __method method.
var args = Array.prototype.slice.call (arguments) makes this code shorthand for this [].slice.call (arguments), but it adds an empty array object to the memory. In order to easily read the point in the simplification can take it off to look into such a form slice.call (arguments), remove call can be false looking to become such a form function slice (arguments) {...}, In fact, Slice is just a prototype method for all arrays. Unlike our custom prototyping approach, it is a built-in method that JavaScript has predefined for developers, which can only be called by arrays. Mickey in the editor after alert (Array.prototype.slice) is Funciton slice () {...}.

Since slice is also just a normal function method, Slice.call (object) so that slice inside of this temporary is replaced is also possible. Just as [].slice () {...} The this pointer inside will point to the same array object that called the slice method. You can use the call method or the Apply method to temporarily change the this pointer within an object that calls this method to the first parameter in the pass parameter, which is temporary and resets after the function has finished releasing memory.
var object=args.shift () saves an object of the [0] position in the array to the object variable, which is the pointer to be replaced.

JS code function O () {this.num = 1;       var fn = function (ARG) {alert (This.num+arg)}.bind (this,2);   FN (); New O ()
Line 3rd of the code: an anonymous function calls the Bind method and passes the O object and a number 2 to the BIND function, both of which pass past parameters that are converted into array form, and the O object is extracted separately into the object. After the BIND function call completes, returns a function to save in the FN variable, now holds the return function of the bind function in the FN variable, and the contents of FN are the fifth line to line seventh of the first code block in the article.
Code line 4th: Invoke the FN function, or call the return value of the BIND function. The number "3" will pop up.

The anonymous function in the bind method implicitly preserves the variables in the environment in which it is run, often called "closures."

This is in many open source framework for developers to make the powerful methods and attributes is this out, for beginners Mickey for the above remarks if there is not the correct place or I think can be reluctantly forgiven, if you found the wrong place please leave a message.

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.