The prototype chain inheritance of JS inheritance

Source: Internet
Author: User

Object-oriented programming will involve the concept of inheritance, JS in the implementation of inheritance is mainly through the prototype chain method.

I. The relationship between a constructor, a prototype, and an instance

Each time a function is created, the function automatically comes with a prototype property. This property is a pointer to an object that we call the prototype object . What is a pointer? The pointer is like the student's school number, the prototype object is the student. We found the only student by the school number. Suppose suddenly, the pointer is set to NULL, the study number is reset empty, do not panic, the object is still there, the students did not disappear. It's just not good to find.

There is a default property constructoron the prototype object, which is also a pointer to its associated constructor.

By invoking the instance generated by the constructor, there is an intrinsic property that points to the prototype object. So the instance has access to all the properties and methods on the prototype object.

  

so the three relationships are that each constructor has a prototype object, and the prototype object contains a pointer to the constructor, and the instance contains an internal pointer to the prototype object. the popular point is that the instance can access the prototype object through an internal pointer, the prototype object through the constructor pointer, and can find the constructor.

  Let's look at an example:

function Dog (name) {    this. Name = name;       This ' Dog '  = function () {alert ('Wang');} var New Dog ('Jiwawa');d oggie.speak ();   //

The above code defines a constructor for the dog (), the Dog.prototype point of the prototype object, its own property construtor also refers back to the dog, that is Dog.prototype.constructor = = dog. Instance doggie can access the Speak method because its internal pointer points to the prototype object.

Dog.prototype is just a pointer to a prototype object, but the prototype object is not special, it's just a normal object. Suppose, at this time, we let Dog.protptype no longer point to the original prototype object, but rather an instance of another class (Animal), what would happen?

Second, the prototype chain

As we said earlier, all instances have an internal pointer to its prototype object and can access all the properties and methods on the prototype object. The doggie instance points to the prototype object of dog and can access all the properties and methods on the dog prototype object, and if the dog prototype object becomes an instance of a Class AAA, and this instance points to a new prototype object AAA, then doggie can access the instance properties of the AAA and the AA at this time. All the properties and methods on the prototype object. Similarly, the new prototype object AAA happens to be another instance of the object BBB, which again points to the new prototype object BBB, so doggie can now access the instance properties of the BBB and all the properties and methods on the BBB prototype object.

This is the way JS through the prototype chain implementation of the method of inheritance. Take a look at the following example:

//define a Animal constructor as the parent of the Dogfunction Animal () { This. supertype ='Animal';} Animal.prototype.superSpeak=function () {alert ( This. supertype);} function Dog (name) { This. Name =name;  This. Type ='Dog'; }//Change dog's prototype pointer to a Animal instanceDog.prototype =NewAnimal ();//that's the equivalent of that.//var animal = new Animal ();//dog.prototype = animal;Dog.prototype.speak=function () {alert ( This. Type);}varDoggie =NewDog ('Jiwawa');d oggie.superspeak (); //Animal

Explain. The above code first defines a Animal constructor, which is given an instance by new Animal (), which contains an instance property Supertype and a prototype property superspeak. In addition, a dog constructor is defined. Then the situation changes, the line in the code is bold, and the prototype object of the dog is overwritten with the animal instance . When the doggie to access the Superspeak attribute, JS will first in the doggie instance properties, found, and then, JS will go to Doggie prototype object up to find, Doggie prototype object has been changed to a animal instance, That is to go to the animal instance to find. First find animal instance attribute, found or not superspeack, finally go to animal prototype object up looking, eh, this just find.

This means that we can implement all the properties and methods of Dog inheriting Animal by means of the prototype chain.

In conclusion: When the prototype object pointed to by Dog.prototype is rewritten, the internal pointer of the instance is also changed, pointing to the new prototype object, and then inheriting the class and class. (However, if an instance is produced before the prototype object is overridden, its internal pointer points to the original prototype object.)

Original link: https://www.cnblogs.com/sarahwang/p/6870072.html

The prototype chain inheritance of JS inheritance

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.