Javascript learning notes (10) js Object Inheritance

1. prototype chain
// Rarely used separately
Copy codeThe Code is as follows:
View Code
// Defines the SuperClass class, which has an attribute property and a method getSuperValue
Function SuperClass (){
This. property = true;
}
SuperClass. prototype. getSuperValue = function (){
Return this. property;
}

// Define the SubClass class. There is an attribute subproperty and a later method getSubValue
Function SubClass (){
This. subproperty = false;
}

// The SubClass class inherits the SuperClass class
SubClass. prototype = new SuperClass ();

// Add a method getSubValue to the SubClass class
SubClass. prototype. getSubValue = function (){
Return this. subproperty;
}

// Create a SubClass instance
Var instance = new SubClass ();
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.
Copy codeThe Code is as follows:
Alert (instance instanceof Object); // true, is the instance an Object instance?
Alert (instance instanceof SuperClass); // true, is the instance a SuperClass instance?
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.
Copy codeThe Code is as follows:
Alert (Object. prototype. isPrototypeOf (instance); // true
Alert (SuperClass. prototype. isPrototypeOf (instance); // true
Alert (SubClass. prototype. isPrototypeOf (instance); // true

3. Notes when using prototype chain to inherit and define methods
Define the order of the Methods:
Copy codeThe Code is as follows:
View Code
Function SuperClass (){
This. property = true;
}
SuperClass. prototype. getSuperValue = function (){
Return this. property;
}

Function SubClass (){
This. subproperty = false;
}

// SubClass inherits SuperClass
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.

// Add a new method
SubClass. prototype. getSubValue = function (){
Return this. subproperty;
}
// Override the superclass Method
SubClass. prototype. getSuperValue = function (){
Return false;
}
Var instance = new SubClass ();
Alert (instance. getSuperValue (); // fales, The SubClass instance calls the getSuperValue () method of SubClass, and shields the getSuperValue () method of SuperClass,
// 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.
Copy codeThe Code is as follows:
View Code
Function SuperClass (name ){
This. name = name;
}
Function SubClass (){
SuperClass. call (this, "RuiLiang"); // inherits the SuperClass and transmits parameters to the SuperClass.
This. age = 29; // instance attributes
}

Var instance = new SubClass ();
Alert (instance. name); // RuiLiang
Alert (instance. age); // 29

6. Combination inheritance
// The most common inheritance mode
Copy codeThe Code is as follows:
View Code
// Create a SuperClass
Function SuperClass (name ){
This. name = name;
This. colors = ["red", "blue", "green"];
}
SuperClass. prototype. sayName = function (){
Alert (this. name );
}

/// Create SubClass
Function SubClass (name, age ){
SuperClass. call (this, name); // inherits attributes
This. age = age; // attributes of the current user
}

SubClass. prototype = new SuperClass (); // Inheritance Method
SubClass. prototype. sayAge = function () {// Add a new method to SubClass
Alert (this. age );
};

// Use
Var instance1 = new SubClass ("RuiLiang", 30 );
Instance1.colors. push ("black ");
Alert (instance1.colors); // "red, blue, green, black"
Instance1.sayName (); // "RuiLiang"
Instance1.sayAge (); // 30

Var instance2 = new SubClass ("XuZuNan", 26 );
Alert (instance2.colors); // "red, blue, green"
Instance2.sayName (); // "RuiLiang"
Instance2.sayAge (); // 30

7. Other inheritance Modes
Original Type inheritance, parasitic inheritance, and parasitic combined inheritance