Working principle behind JavaScriptprototype

Source: Internet
Author: User
Prototype literal translation is a prototype and is the main tool for inheriting javascript implementations.

Prototype literal translation is a prototype and the main means for javascript to implement inheritance. Roughly speaking, prototype is a reserved property of functions in javascript, and its value is an object (we can call this object "prototype object ").

Objects constructed by using this function as constructor automatically have the member attributes and methods of the prototype object of the constructor.

The main points are:

  1. Prototype is a required attribute of a function (a written statement is "Reserved attribute") (a prototype attribute must exist as long as it is a function)
  2. The value of prototype is an object.
  3. You can modify the value of the prototype attribute of a function at will.
  4. An object automatically owns the prototype member attributes and methods of the constructor of this object.
// Define a function (constructor) and define some attributes and methods to inherit var function1 = function () {this. name = "function1"; this. saySomething = function () {alert ("This's a method of" + this. name) ;}// define a method} // define another constructor var function2 = function () {} // set the prototype attribute of the constructor function2 to an object constructed by function1, so that the objects constructed by function2 (and originally objects without any attributes and methods) have the attributes and Methods function2.prototype = new function1 (); var obj1 = new function1 (); // No member of obj1, too many prot The otype mechanism is that it enjoys the attributes and methods of the function1 object. Obj1.saySomething ();

Of course, the above example is far from the "inheritance" actually used, but it also shows the meaning of inheritance: an object has the attributes and methods of another object. (For example, if a son has his father's blood type and temper, humans inherit the animal's instinct, such as eating and fighting)

The concepts and functions of prototype are outlined in the above section, but it is not enough to understand prototype. Now let's take a look at how prototype works:

Let's take a look at the process of creating an object in the form of new:

// Use func () as the constructor to create an object objvar obj = new func ();

This process is like this: After the javascript engine first encounters the keyword new, it immediately opens up a piece of memory and creates an empty object (and points this to this object ), then execute the constructor func () to construct this empty object (all the attributes and methods in the constructor are assembled for this blank object one by one, that is why the constructor is called "Constructor ).

In fact, there is another thing between new and the execution of constructor that the engine did not explicitly tell us, but secretly did it. This is to assign the prototype object to this empty object.

Here we have to mention something that is retained by the system and equally important like prototype: __proto __

_ Proto _ is the built-in attribute automatically owned by an object (Note: prototype is the built-in attribute of the function, __proto _ is the built-in attribute of the object, but they all eventually point to the same object, that is, the object to be inherited). chrome and FF can be used to access the _ proto _ attribute of an object, and IE cannot.

It is precisely because the _ proto _ of an object points to the prototype object of the constructor of this object that makes this object understand the prototype object of its constructor, and has the attributes and methods of this prototype object.

Therefore, the var obj = new func () process is more specific:

  1. When the javascript parsing engine encounters a new one, it opens up a piece of memory and creates an empty object, and points "this" to this empty object.
  2. The javascript parsing engine points the _ proto _ of this empty object to the default prototype object of the constructor that follows. (After pointing to the prototype object, the parsing engine will know "Oh, this object must have the attributes and methods of this prototype object ")
  3. The javascript parsing engine executes the code in the constructor body and formally begins the process of constructing (or assembling) this empty object. name = "xxx", this. sayHello = function (){...} and so on)
  4. The object is constructed and assembled, and assigned to the variable on the left of the equal sign.

Address of this article: http://www.nowamagic.net/librarys/veda/detail/587,welcome.

Related Article

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.