Inheritance, in layman's terms, you have previously written some classes, some of which are the subset or basically the same functions of the classes you want to write now, you do not need to completely re-write a new class. You can use the previously written class. this code reuse process is called inheritance. Before learning javascript inheritance in depth, you should first understand the following concepts:
Parent class: inherited class
Subclass: inherited class
Superclass: that is, the parent class
Abstract class: a class that is generally not instantiated. It is used to inherit other classes.
Base Class: provided to other classes that can be inherited
Derived class: Class inherited from the base class
There are five methods to inherit javascript objects:
1. Object impersonating
2. call () method
3. apply ()
4. prototype chain
5. hybrid mode
A. Object impersonating
The so-called object impersonating is that the new class impersonates the old class (the old class must adopt the constructor method) to achieve the purpose of inheritance.
Eg.1
The Code is as follows:
Function people (name, sex, age) {// use the constructor Method
This. name = name;
This. sex = sex;
This. age = age;
This. say = function (){
Alert ("My name is" + this. name );
};
This. doing = function (){
Alert ("I am speaking ");
};
}
Var Marry = new people ("Marry", "Woman", "23 ");
Marry. say ();
Marry. doing ();
Function white_people (name, sex, age ){
This. inherit = people;
This. inherit (name, sex, age );
Delete this. inherit;
This. area = function (){
Alert ("I am in Europe ");
}
}
Var Tom = new white_people ("Tom", "man", "21 ");
Tom. say ();
Tom. area ();
Alert (Tom. age );
In the above example, people is the base class used for white_people. Remember that this format is used for object impersonating for inheritance purposes.
This. inherit = people; // impersonate
This. inherit (name, sex, age); // inherit
Delete this. inherit; // delete inheritance
All new attributes and new methods must be deleted and defined after inheritance, so as to avoid overwriting the relevant attributes and methods of the parent class.
In addition, object impersonating supports multi-inheritance.
Eg.2
The Code is as follows:
Function worker (pay, work ){
This. pay = pay;
This. work = work;
}
Function city_worker (name, sex, age, pay, work ){
This. inherit = people;
This. inherit (name, sex, age );
Delete this. inherit;
This. inherit = worker;
This. inherit (pay, work );
Delete this. inherit;
}
Var Jerry = new city_worker ("Jerry", "man", "21", "$1000", "coder ");
Jerry. say ();
Alert (Jerry. work );
There is a deficiency in object impersonating: when multiple inheritance mechanisms are implemented, if the base class has the same attributes or methods, it will inherit from the following classes.
B. call () method
This is just a function impersonating the encapsulated object. In this way, we no longer need to write the "classic" sentence, but use the following sentence instead:
Base class. call (object, parameter list)
Eg.1
The Code is as follows:
Function farmer (name, sex, age, pay, work ){
People. call (this, name, sex, age );
Worker. call (this, pay, work );
}
Var Nicolas = new farmer ("Nicolas", "man", "27", "$3000", "irrigator ");
Nicolas. say ();
Alert (Nicolas. pay );
Similarly, call () has a small problem of attributes and methods with the same name.
C. apply ()
Like call (). apply () is also an encapsulation function of object impersonating. Its format is:
Base class. apply (object, parameter array );
Eg.1
The Code is as follows:
Function white_collar (name, sex, age, pay, work ){
People. apply (this, new Array (name, sex, age ));
Worker. apply (this, [pay, work]);
}
Var Jiessie = new white_collar ("Jiessie", "woman", "26", "$2500", "editor ");
Jiessie. say ();
Alert (Jiessie. work );
Similarly, apply () has the same name attribute and method.
D. prototype chain
The above three methods use constructor inheritance, corresponding to the ground, and also have prototype function inheritance: prototype chain.
Eg.1
The Code is as follows:
Function blue_collar (){
}
Blue_collar.prototype.name = "Jean ";
Blue_collar.prototype.age = "33 ";
Blue_collar.prototype.say = function (){
Alert ("my name is" + this. name );
};
Function city_blue_collar (){
}
City_blue_collar.prototype = new blue_collar ();
Var jj = new city_blue_collar;
Jj. say ();
Prototype chain also has the disadvantages of prototype chain: parameter cannot be passed. In addition, prototype chain does not support multi-inheritance because
E. hybrid mode
Use constructor to write the class attributes, and use call () or apply () to inherit the attributes ()
The method written in prototype mode, and the method inheritance uses the prototype chain.
Eg.1
The Code is as follows:
Function beauty (name, age ){
This. name = name;
This. age = age;
}
Beauty. prototype. say = function (){
Alert ("female name" + this. name );
};
Function china_beauty (name, age, area ){
Beauty. call (this, name, age );
This. area = area;
}
China_beauty.prototype = new beauty ();
China_beauty.prototype.from = function (){
Alert ("I am from" + this. area );
};
Var diaochan = new china_beauty ("mink Chan", "16", "linxiao ");
Diaochan. say ();
Diaochan. from ();
Alert (diaochan. age );