Introduction to how javascript is inherited

Phase 1:
Copy codeThe Code is as follows:
Function (){
This. funB = function (){
Alert ('a: funb ');
};
}
A. prototype = {
FunA: function (){
Alert ('a: funa ');
}
};
Function B (){
}
Function extend (sub, parent ){
Sub. prototype = new parent ();
Sub. prototype. constructor = sub;
}
Extend (B, );
Var B = new B ();
B. funA (); // out 'a: funa'
B. funB (); // out 'a: funb'
Alert (B instanceof A); // out "true"

We can see at A glance what it means. First, we define two classes A and B, and then use the extend method to let B inherit Class. The principle of extend is to make the parent class new to the prototype of the subclass.
If you want to set instanceof to true, the prototype object of the two classes must be the same object, whether indirect or direct.
Is there a problem with this method? In object-oriented languages, when a subclass inherits the parent class, it does not trigger the execution of the constructor of the parent class. In this case, the parent class is executed during inheritance.
Stage 2
Copy codeThe Code is as follows:
Function (){
This. Astr = 'Hello ';
}
A. prototype = {
FunA: function (){
Alert (this. Astr );
}
};
Function B (){
Arguments. callee. superclass & arguments. callee. superclass. apply (this, arguments );
This. Bstr = 'Hello B ';
}
B. prototype = {
FunB: function (){
Alert (this. Bstr );
}
};
Function C (){
Arguments. callee. superclass & arguments. callee. superclass. apply (this, arguments );
Alert (this. Astr );
Alert (this. Bstr );
}
Function extend (sub, parent ){
Var subproto = sub. prototype;
Sub. prototype = parent. prototype;
Typeof subproto! = 'Object' & (subproto = {});
Typeof sub. prototype! = 'Object' & (sub. prototype = {});
For (var I in subproto ){
Sub. prototype [I] = subproto [I];
}
Sub. superclass = parent;
}
// B inherits
Extend (B, );
// C inherits B
Extend (C, B );
Var c = new C (); // out 'Hello A', 'Hello B'
C. funA (); // out 'Hello'
C. funB (); // out 'Hello B'
Alert (c instanceof A) // out true
Alert (c instanceof B) // out true;

Here we have made some changes to the extend method. Here we have an agreement that each subclass has a superclass attribute to reference the parent class inherited by her, use an empty function proto obtain the prototype of the parent class and instantiate it to the prototype of the subclass. In this way, the parent class constructor is not executed.
Instead, the sub-class constructor uses a piece of code to execute the parent class constructor.
Copy codeThe Code is as follows:
Arguments. callee. superclass & arguments. callee. superclass. apply (this, argumengs );

In this way, class inheritance is completed.
Is there any more convenient Inheritance Method for the above Code? modify the Function prototype to see:
Copy codeThe Code is as follows:
Function. prototype. extend = function (parent ){
Var subproto = this. prototype;
This. prototype = parent. prototype;
Typeof subproto! = 'Object' & (subproto = {});
Typeof this. prototype! = 'Object' & (this. prototype = {});
For (var I in subproto ){
This. prototype [I] = subproto [I];
}
This. superclass = parent;
Return this;
}
Function (){
This. Astr = 'Hello ';
}
A. prototype = {
FunA: function (){
Alert (this. Astr );
}
};
Var B = function (){
Arguments. callee. superclass & arguments. callee. superclass. apply (this, arguments );
This. Bstr = 'Hello B ';
}
B. prototype = {
FunB: function (){
Alert (this. Astr );
}
};
B. extend ();
Var C = function (){
Arguments. callee. superclass & arguments. callee. superclass. apply (this, arguments );
Alert (this. Astr );
Alert (this. Bstr );
}. Extend (B );
Var c = new C (); // out 'Hello A', 'Hello B'
C. funA (); // out 'Hello'
C. funB (); // out 'Hello B'
Alert (c instanceof A) // out true
Alert (c instanceof B) // out true;

Here, extend does the following: subproto references the original prototype of the subclass and points the prototype of the subclass to the prototype object of the parent class, in this way, the parent class is inherited (this aims to make the parent class of the subclass instance instanceof true ). Then, subproto is used to add members of the original prototype to the current prototype, so that the cognominal members of the subclass will overwrite the members of the parent class. Finally, point the superclass attribute of the subclass to the parent class.
The key to js inheritance is to maintain the uniqueness of the prototype chain. instanceof is used to determine whether the _ proto _ of the instance is the same Object as the prototype of the parent class.

Author cnblogs OD