Javascript object-oriented 2-"inheritance"

Let's continue with the article "javascript-object-oriented, how much do you know" on the blog to continue with the object-oriented features of javascript. This time we say "inherit ".

When I first heard about the inheritance of javascript, I was a bit confused. Because javascript does not have the concept of "class", how can it inherit? What is in javascript? Objects and functions are available. variables, attributes, and functions (built-in) are usually defined in an object ). This structure is like a class. Inheritance is actually to reuse something. In javascript, we can regard this function as a class and then inherit it.

There are two methods to implement inheritance in javascript.

I. Prototype Inheritance Law

Each class (function) has a prototype. Members of this prototype are passed to the class's instantiated object when the class is instantiated. There is no prototype on the instantiated object, but it can be used as the prototype of another class (function). When the class is instantiated with this object as the prototype, the members on the object will be passed to the instantiated object of the class as the prototype. This is the essence of prototype inheritance.

Function parentClass () {// private field var x = "I'm a parentClass field! "; // Private method function method1 () {alert (x); alert (" I'm a parentClass method! ");} // Public field this. x =" I'm a parentClass object field! "; // Public method this. method1 = function () {alert (x); alert (this. x); method1 () ;}} parentClass. prototype. method = function () {alert ("I'm a parentClass prototype method! ");} ParentClass. staticMethod = function () {alert (" I'm a parentClass static method! ");} Function subClass () {// private field var x =" I'm a subClass field! "; // Private method function method2 () {alert (x); alert (" I'm a subClass method! ");} // Public field this. x =" I'm a subClass object field! "; // Public method this. method2 = function () {alert (x); alert (this. x); method2 ();} this. method3 = function () {method1 () ;}// inheritsubClass. prototype = new parentClass (); // new object, assigned to subclass. // equivalent to var p = parentClass (); subClass. prototype = p; create an instantiated object of the parent class and then assign the object to the prototype attribute of the subclass. subClass. prototype. constructor = subClass; // assign the subClass itself to its prototype constructor attribute. Note: The value assignment here is not (). // Testvar o = new subClass (); // instantiate the subClass alert (o instanceof parentClass); // truealert (o instanceof subClass); // true // pass inheritance, all public instance members in the parent class inherit from the quilt class. The instantiated object of the subclass belongs to both the subclass and the parent class. Alert (o. constructor); // function subClass () {...} // assign a value through the prototype to view the constructor attribute subClass of the instantiated object of the subClass instead of its parent class. O. method1 (); // I'm a parentClass field! // I'm a subClass object field! // I'm a parentClass field! // I'm a parentClass method! // In the public instance method inherited by the subclass, if the private instance field or private instance method is called, The called Private instance members belong to the parent class. O. method2 (); // I'm a subClass field! // I'm a subClass object field! // I'm a subClass field! // I'm a subClass method! // The instance method defined in the subclass. If the private instance field or private instance method is called, The called Private instance members belong to the subclass. O. method (); // I'm a parentClass prototype method! The method defined on the parent class prototype will inherit the quilt class. O. method3 (); // Error !!! The instance method defined in the subclass cannot access the private instance members defined in the parent class. SubClass. staticMethod (); // Error !!! Static members are not inherited.

Ii. Call the Inheritance Law (Object impersonating)

The essence of calling inheritance is that in the constructor of the subclass, the constructor method of the parent class is executed in the context of the sub-class execution, in the parent constructor method, all the content operated by this method is actually the content on the instantiated object of the subclass operated. Therefore, this approach is only intended to reduce repeated code writing.

function parentClass() {    // private field    var x = "I'm a parentClass field!";    // private method    function method1() {

Alert (x); alert ("I'm a parentClass method! ");} // Public field this. x =" I'm a parentClass object field! "; // Public method this. method1 = function () {alert (x); alert (this. x); method1 () ;}} parentClass. prototype. method = function () {alert ("I'm a parentClass prototype method! ");} ParentClass. staticMethod = function () {alert (" I'm a parentClass static method! ");} Function subClass () {// inherit parentClass. call (this); // pass in the this pointer of the subClass through the call method of the parent class. Make the parent class method run in the context of the subclass. In this way, all the public instance members defined in this mode within the parent class will inherit from the quilt class.

    // private field    var x = "I'm a subClass field!";    // private method    function method2() {

        alert(x);        alert("I'm a subClass method!");    }    // public field    this.x = "I'm a subClass object field!";

    // public method    this.method2 = function() {        alert(x);        alert(this.x);

Method2 ();} this. method3 = function () {method1 () ;}// testvar o = new subClass (); alert (o instanceof parentClass); // falsealert (o instanceof subClass ); // true // inherited by call, the instantiated object of the subclass only belongs to the subclass, not the parent class. Alert (o. constructor); // function subClass (){...} same as prototype inheritance, the constructor attribute belongs to the subclass o. method1 (); // I'm a parentClass field! // I'm a subClass object field! // I'm a parentClass field! // I'm a parentClass method! // All the inherited public variables and methods in the parent class can be accessed. O. method2 (); // I'm a subClass field! // I'm a subClass object field! // I'm a subClass field! // I'm a subClass method! // Subclass can call its own method and variable o. method () at will; // error defines the method on the parent class prototype, and will not inherit from the quilt class. O. method3 (); // The instance methods defined in the error subclass cannot access the private instance members defined in the parent class. SubClass. staticMethod (); // The error static member will not be inherited.

PS: Think about the following code and get two points:

Alert (o instanceof parentClass); // false

Alert (o instanceof subClass); // true

Compared with prototype inheritance, Here o does not belong to the parent class. Why do I think calling this method is not really an inheritance, that is, "call"? There is also another method: object impersonating is not a real inheritance. In this way, you can access another type of common methods and variables. Therefore, subclass objects do not belong to the parent class. This is one of the two differences: multiple inheritance can be implemented by calling the inheritance method. Since it is a call, it is OK to call multiple classes in one class. A subclass can inherit from multiple parent classes and all the public instance members defined in the parent class by using this method.

Comparison of the two methods

Prototype inheritance: Only attributes are inherited. parameters cannot be passed and cannot be shared? Son. Prototype = newfather ();

Call inheritance (Object impersonating): Only information in the constructor (passing parameters) can be inherited, and attributes (Sharing) cannot be inherited ). Father. call (this, pro1, pro2 );

Summary:In practical applications, we can combine the two methods based on our own needs to meet the needs of different methods and prototype access, so as to achieve attribute sharing, the method is independent. There are several types:

Combination Mode (prototype + constructor) (attribute sharing, independent method)

Parasitic inheritance (original type + factory method)

Zookeeper