JavaScript's prototype understanding

Source: Internet
Author: User
Tags function prototype

I've been learning about JavaScript prototypes lately, and it's a little bit of an understanding of what I understand, with simple examples and explanations, to get more people to erase JavaScript prototypes.

1, prototype prototype is a what thing

Each function we create has a prototype property, which is a pointer to an object. Simply put, prototype is an object.

Understanding prototype Objects:

Whenever a new function is created, a prototype property is created for the function based on a specific set of rules, which points to the prototype object of the function. After you create a custom constructor, the prototype object will only get the constructor property by default, and as for the other methods, it is inherited from Object, when an instance is created with a constructor, the instance inside will contain a pointer (internal property) __proto__, which points to the constructor's prototype. by accessing the object's __proto__ property, this property is completely invisible in the script, which exists between the instance and the prototype object of the constructor, rather than between the instance and the constructor. The above words do not understand, do not be afraid, we say a word to verify.

And then I'm going to clean it up. See prototype prototype this thing, in the browser console, enter the following code (if you don't even know the console, don't play)

function A () {this.name = "Xiami";}

To see our prototype property, enter the following code in the console (the image is the returned result representation)

A.prototype

See what this prototype object has.

By default it has a constructor property that points to our constructors

Now let's see if this function is instantiated, and its prototype is still there?

A = new A ();

Now that A is an instance of a function, if we give I now add the name attribute to the A function prototype to 1, can I see it in the A object?

A.prototype.name = 1;

Then input a.name, found that the result is 1, how so magical, after instantiation, the constructor of the prototype to add attributes, but also can be accessed by the object. This method is not recommended to use, the word is not easy to be tracked, the specific situation I have not encountered, then how it is realized? Let's take a look at the above sentence.

when an instance is created with a constructor, the instance inside will contain a pointer (internal property) __proto__, which points to the constructor's prototype. This property is not necessarily __proto__, but this pointer must be present, I found in Firefox is using the __proto__ property, this time we can use a.__proto__ to view our a prototype object, is it true?

Click where the arrow points, such as

is not the same as the prototype object we saw before, is it understood that the above sentence, which is also after the instantiation, the addition of the prototype properties, in the object can also be accessed in the reason?

The name above is the Name property that was added to the prototype object for constructor A, which also shows that they point to the same prototype

The following is the most initialized state, as long as the function exists, the object exists, and the property or pointer is present.

After adding the Name property to the prototype object

Originally thought there is a lot to write, this article wrote several times, may understand is not very deep, suddenly found nothing to write, ready to write again

To be continued in:

Reference:

JavaScript Advanced Programming Third Edition, 6th chapter, Object-oriented programming

JavaScript's prototype understanding

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.