Understanding of the JavaScript prototype chain

Source: Internet
Author: User
Tags object object

First, the concept of the prototype chain

JavaScript is an object-oriented programming language in which everythingin JavaScript is an object , and objects are not independent of each other, but have "inherited" relationships.

This "inheritance" relationship differs from the inheritance in Java or C #. Java or C # has the concept of a class, subclasses inherit the parent class, implemented by the extends keyword, but there is no real class (Class) in JavaScript, but there is a similar concept-prototype object; a inherits B, then a "__proto__ "Property points to the" prototype "property of B, thus having the following:

The relationship between A and B is: a.__proto__----------> B.prototype, which means that the prototype of a (__proto__) points to the prototype object of B (prototype).

From A to B, we see a chain that has a point to the relationship, so is this the topic of today-the prototype chain? The answer is: no .

The prototype chain requires the end node to be null,b.prototype not equal to NULL, whose prototype will be null? The answer is:The Object object's prototype--object.prototype, so there are the following:

So, I summarize the definition of the prototype chain as: A group of objects with an inheritance relationship, through the __proto__ attribute to establish a pointing relationship, and eventually point to null, thus forming a point to the chain of relationships, we call the prototype chain.

Second, why there is such a pointing relationship

Now, while knowing what a prototype chain is, why is this pointing to the relationship and forming such a chain, let's continue to explore:

First, understand the concept:

①, object classification As mentioned above, all things in JavaScript are objects, and these objects can be divided into two main classes: function objects and ordinary objects . The classification is based on whether it has a prototype object (prototype), or whether it has a prototype property . The function object has the prototype property, and the normal object does not;

②,prototype prototype objects, all the properties and methods in the object, are inherited to the child objects, shared by the children;

③,__proto__ prototypes. Any inherited object has and has only one prototype, and is indicated by its __proto__ property.

Since everything in JavaScript is object, and these objects eventually inherit from the object, the two nodes at the end of the prototype chain must be object.prototype and null.

Third, the object

In the previous article, we mentioned a concept countless times, that is , the object, what is the object? Object is a collection of properties and methods, the most typical

var obj = {        ' hjx ',        +,        function() {            Console.log (' hello! ' );        }}

Obj is an object that has property Name,age and has method SayHello (). With the words "collection of properties and methods", it is difficult to understand the inheritance relationships and principles in JavaScript, so introduce the concept:

Properties and methods that are pointed to by the __proto__ property by an implicit property.

Properties and methods that display properties that are not __proto__ properties, Display properties are divided into shared properties and non-shared properties .

③, shared properties are inherited to child objects, and properties and methods are shared by sub-objects. (Shared: A public resource for all child objects that, once changed, has been changed when all child objects are accessed.) Essentially, at the time of the inheritance, the __proto__ property of all child objects points to it, in memory this property is only one copy, and both child and parent objects can read and write.

When ④, non-shared properties (local properties) are inherited to child objects, the properties and methods that are individually enjoyed by the sub-object become local properties. (Exclusive: When inheriting, a copy is copied in the memory space of each child object, independently of the child objects)

Use an equation to express an object: Object = Display Property (Shared Property + Local property) + Implicit property

Iv. Relationship Diagram

Diagram Summary:

The __proto__ property of the ①, child object points to the prototype property of the parent object (the prototype of the child object points to the parent object's prototype object);

The __proto__ property of the ② and object object points to the prototype property of the function object (the prototype of the object objects points to the prototype object of the function object);

The __proto__ property of the ③, function object points to its own prototype property (the prototype of the function object points to its own prototype object);

The __proto__ property of the prototype property of the ④, function object points to the prototype property of object (the prototype object of the function object points to the prototype object of the object, because, The prototype object of a function object is an object that is inherited by the object objects.

The __proto__ property of the prototype property of the ⑤ and object object points to null (the prototype of the object object points to null, because the prototype of all objects ultimately points to the prototype object of the object, However, the object object's prototype is an object, and JavaScript specifies that it points to null, so the object object's prototype Object.prototype is always on the prototype chain, except for the null unexpected top position.

Finish ~

Understanding of the JavaScript prototype chain

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.