Javascript learning notes (10) objects-Inheritance

1. prototype chain
// Rarely used separately
View Code
 
1 // define the SuperClass class, which has an attribute property and a method getSuperValue
2 function SuperClass (){
3 this. property = true;
4}
5 SuperClass. prototype. getSuperValue = function (){
6 return this. property;
7}
8
9 // define the SubClass class. There is an attribute subproperty and a later added method getSubValue.
10 function SubClass (){
11 this. subproperty = false;
12}
13
14 // The SubClass class inherits the SuperClass class
15 SubClass. prototype = new SuperClass ();
16
17 // Add a method getSubValue to the SubClass class
18 SubClass. prototype. getSubValue = function (){
19 return this. subproperty;
20}
21
22 // create a SubClass instance
23 var instance = new SubClass ();
24 alert (instance. getSuperValue ());
 
2. determine the relationship between the prototype and the instance
The first method is to use the instanceof operator to test the constructor that has occurred in the instance and prototype chain.
1 alert (instance instanceof Object); // true, is the instance an Object instance?
2 alert (instance instanceof SuperClass); // true, is the instance a SuperClass instance?
3 alert (instance instanceof SubClass); // true, is the instance a SubClass instance?
The second method uses the isPrototypeOf () method to test the prototype that appears in the prototype chain.
1 alert (Object. prototype. isPrototypeOf (instance); // true
2 alert (SuperClass. prototype. isPrototypeOf (instance); // true
3 alert (SubClass. prototype. isPrototypeOf (instance); // true
3. Notes when using prototype chain to inherit and define methods
Define the order of the Methods:
View Code
 
1 function SuperClass (){
2 this. property = true;
3}
4 SuperClass. prototype. getSuperValue = function (){
5 return this. property;
6}
7
8 function SubClass (){
9 this. subproperty = false;
10}
11
12 // SubClass inherits SuperClass
13 SubClass. prototype = new SuperClass (); // This should be written first. The newly added method and the method for rewriting the SuperClass should be written later. Otherwise, the overwritten SuperClass method will never be called.
14
15 // Add a new method
16 SubClass. prototype. getSubValue = function (){
17 return this. subproperty;
18}
19 // rewrite the superclass method www.2cto.com
20 SubClass. prototype. getSuperValue = function (){
21 return false;
22}
23
24 var instance = new SubClass ();
25 alert (instance. getSuperValue (); // fales, The SubClass instance calls the getSuperValue () method of SubClass, and shields the getSuperValue () method of SuperClass,
26 // The SuperClass method calls the SuperClass getSuperValue () method.
 
Disadvantages of prototype chain inheritance: 1) share attributes in the superclass; 2) do not pass parameters to the superclass when creating subclasses. All seldom use prototype chains separately
4. Borrow Constructors
// Rarely used separately

Advantage: You can pass parameters to a superclass. Disadvantage: functions cannot be reused. All classes must use the constructor mode.
View Code
 
1 function SuperClass (name ){
2 this. name = name;
3}
4 function SubClass (){
5 SuperClass. call (this, "RuiLiang"); // inherits the SuperClass and transmits parameters to the SuperClass.
6 this. age = 29; // instance attributes
7}
8
9 var instance = new SubClass ();
10 alert (instance. name); // RuiLiang
11 alert (instance. age); // 29
 
6. Combination inheritance
// The most common inheritance mode
View Code
 
1 // create a SuperClass
2 function SuperClass (name ){
3 this. name = name;
4 this. colors = ["red", "blue", "green"];
5}
6 SuperClass. prototype. sayName = function (){
7 alert (this. name );
8}
9
10 //// create SubClass
11 function SubClass (name, age ){
12 SuperClass. call (this, name); // inherit attributes
13 this. age = age; // attributes of the current user
14}
15
16 SubClass. prototype = new SuperClass (); // Inheritance Method
17 SubClass. prototype. sayAge = function () {// Add a new method to SubClass
18 alert (this. age );
19 };
20
21 // use
22 var instance1 = new SubClass ("RuiLiang", 30 );
23 instance1.colors. push ("black ");
24 alert (instance1.colors); // "red, blue, green, black"
25 instance1.sayName (); // "RuiLiang"
26 instance1.sayAge (); // 30
27
28 var instance2 = new SubClass ("XuZuNan", 26 );
29 alert (instance2.colors); // "red, blue, green"
30 instance2.sayName (); // "RuiLiang"
31 instance2.sayAge (); // 30
 
7. Other inheritance Modes
Original Type inheritance, parasitic inheritance, and parasitic combined inheritance

 

 

From Sunday walk