In the previous sections, we talked about the JavaScript object-oriented namespace, javascript object-oriented JavaScript classes, JavaScript object-oriented Private Members and public members, and the overloading of Javascript object-oriented, you can read the above before proceeding.
There are multiple methods to implement inheritance in JavaScript. The following two are common methods.
I. call inheritance. first look at the Code:
First define a "person" Class
Copy codeThe Code is as follows: // human
Person = function (){
This. name = "grass mud horse ";
This. eat = function (){
Alert ("I want to eat ");
}
This. sleep = function (){
Alert ("I want to go to bed ");
}
}
Define another student class to inherit from PersonCopy codeThe Code is as follows: // Student Class
Student = function (){
Person. call (this); // inherits the Person class
This. doHomework = function (){
Alert ("My teacher is here, I want to copy my homework ");
}
}
The key is Person. call (this), where this represents the current object, that is, Student, which is easy to understand, and Person. call (this) means to "Attach" all public members of the Person class to the Student class, so that Student has all the functions of the Person class.
Like a high-level language, if a member with the same name as the parent class appears in the subclass, it will overwrite it, that is, the so-called "Rewrite.
Similarly, we define another girl class:Copy codeThe Code is as follows: // girl class
Girl = function (){
Person. call (this); // inherits the Person class
This. sex = "female ";
}
JavaScript can implement multiple inheritance. Please refer to the following Master (Master) class. This Master is naturally a student, but it is also a beautiful mm, so with the following code:Copy codeThe Code is as follows: // Master Class
Master = function (){
Student. call (this); // inherits the Student class
Girl. call (this); // inherits the Girl class
This. degree = "master"; // degree
}
We can test it:Copy codeThe Code is as follows: var master = new Master ();
Master. name = "Fengjie ";
Master. eat ();
Master. doHomework ();
Alert ("even the name is:" + master. name );
Alert ("even gender:" + master. sex );
Pay attention to the sequence of Multi-inheritance. If two classes have members with the same name, the latter will overwrite the previous one, that is, the current class will only inherit the members of the next class.
This is the inheritance of the call method. If you are not clear about the call method, please ask Google brother. I will not repeat it here and I will not repost it on the Internet too much. The following describes another inheritance method.
Ii. prototype inheritance:
Let's define another class leader:Copy codeThe Code is as follows: // shift leader class
SquadLeader = function (){
// Greeting
This. hi = function (){
Alert ("Hello students, I am the shift leader now ");
}
}
The Master class is defined above. Now this Master class has been promoted to the shift leader, so this Master will inherit SquadLeader. This time we will use prototype for implementation. Please refer to the following code:Copy codeThe Code is as follows: Master. prototype = new SquadLeader (); // The prototype attribute points to an object
// Or
// Master. prototype = SquadLeader. prototype;
In this way, the Master inherits the SquadLeader class. In this case, there are two forms, in which the principle is the same. It means that the "soul" of SquadLeader is copied to the Master, so the Master can do what SquadLeader can do.
Test:
Var master = new Master ();
Master. hi () // output "Hello students, I am the shift leader now"
I personally prefer to use the first method (call inheritance) to implement inheritance. All code is included in a "{}", which is clear at a glance, the writing style is closer to C # than the second one #. The prototype attribute is generally used to extend existing classes.
JavaScript is a very flexible language, and there may be other better ways to implement inheritance. You can study and explore it. Here I am throwing a brick, hoping to bring out the gorgeous Jade!