July 20, 2015 the eighth object-oriented three: inheritance

The inheritance of JavaScript is implemented through the prototype chain, and the prototype chain is composed of the __proto__ properties of the prototype objects of the various levels of functions.

We know that when a function is instantiated, the instance object has the properties and methods of the function and a __proto__, which points to the prototype object of the function, and thus the properties and methods of the prototype object.

If we have the following function (from Advanced Programming III):

function supertype () {    thistruefunction  () {    return  This . property;};

when we instantiate it, we get an S,  var s = new supertype (); the memory of this s is actually saved in the following content:

Memory display of S

Property:true

Reference to the __proto__:supertype prototype object

We can also invoke the Getsupervalue () method in the prototype, but this method is stored in the function prototype, which JS helps us to find and invoke, not in the memory address of S.

Then we create another function: Subtype, the code is as follows:

function subtype () {    thisfalse;}

At this point, the two functions are not related, and we say the following:

We want subtype (the parent class) to inherit from the Supertype (parent class), and the object that is instantiated through the parent class can have all the properties and methods of the parent class and the parent class, how is it implemented?

We know that the instantiated object has all the properties and methods of its parent class, and a __proto__ property that points to the parent prototype object, so that we can also invoke the properties and methods of the parent class's prototype, which we have to remember.

We design this, if we want our parent class (subtype) prototype object has the parent class (Supertype) The property and the method, as well as the parent class prototype object's reference, does not have access to the parent class's property and the method, Can you also access the properties and methods of the parent parent class and the prototype object of the parent parent class?

So wordy, turn around in your head.

What is a parent class that has all the properties and methods of the parent class, and a prototype object reference to the parent parent class? is an instance of the parent class! (Have I understood for a long time that you believe it?) More than a dead knock).

So, we can do this by turning the address of the parent class into an instance of the parent class, and the code is as follows:

<script>functionsupertype () { This. property =true;} SuperType.prototype.getSuperValue=function () {  return  This. property;};vars =Newsupertype ();functionsubtype () { This. Subproperty =false;} Subtype.prototype=Newsupertype ();</script>

Such an inheritance can be expressed as follows:

If we var sub = new subtype (), to create an instance of subtype, what does it ultimately contain?

Memory display for instance Sub	Subtype Prototype object (supertype instance) memory display	Prototype objects for Supertype
Subproperty:false	Property:true;	Constructor:supertype
Prototype objects for __proto__:subtype	Prototype objects for __proto__:supertype	Getsupervalue ();

All the basic properties of the parent class are now transformed into the prototype properties of our parent class, and the prototype object of the parent class becomes the __proto__ property of our prototype object, allowing access to methods and properties within the prototype object of the parent class.

There's a pit here, and that's us. If the methods and properties in the prototype object itself (not inherited) are "lost", we cannot define our prototype properties and methods prior to inheritance, which need to be inherited.

functionsupertype () { This. property =true;} SuperType.prototype.getSuperValue=function () {    return  This. property;}; vars =Newsupertype ();functionsubtype () { This. Subproperty =false;} //SubType.prototype.sayName = function () {//Put here will be discarded for inheritance reasons! //Console.log (this.property);// }Subtype.prototype=Newsupertype (); SubType.prototype.sayName=function() {//Your own prototype properties and methods should be set after inheritanceConsole.log ( This. property);}varSub =Newsubtype (); Sub.sayname ();

July 20, 2015 the eighth object-oriented three: inheritance