The previous sections talked about JavaScript object-oriented namespace, javascript object-oriented JavaScript class, JavaScript object-oriented private members and public members With Javascript object-oriented overloading, you can read the above first and then continue to read below.
There are many ways to implement inheritance in JavaScript. Here are two common ones.
1. Call inheritance, look at the code first:
First define a "person" class
//Human
Person=function(){
this.name="Grass Mud Horse";
this.eat=function(){
alert("I want to eat");
}
this.sleep=function(){
alert("I want to sleep");
}
}
Define another student class and let it inherit from Person
//Student class
Student=function(){
Person.call(this);//Inherit Person class
this.doHomework=function(){
alert("The teacher is here , let me copy the homework");
}
}
The key is to look at the sentence Person.call(this), where this represents the current object, that is, Student, which is easy to understand. , and Person.call(this) means: "attach" all the public members of the Person class to the Student class, so that the Student also has all the functions of Person.
Like high-level languages, if a member with the same name as the parent class appears in the subclass, it will be overwritten, which is the so-called "rewriting".
Similarly, we define a girl class:
//Girl class
Girl=function(){
Person.call(this);//Inherit Person class
this.sex="female";
}
JavaScript can implement multiple inheritance. Please look at the Master class below. This Master is naturally a student, but at the same time he is also a pretty girl, so we have the following code:
//Master class
Master=function(){
Student.call(this );//Inherit the Student class
Girl.call(this);//Inherit the Girl class
this.degree="Master's degree";//Education
}
We can test it:
var master=new Master ();
master.name="Sister Feng";
master.eat();
master.doHomework();
alert("My name is: " master.name);
alert("My gender is:" master.sex);
Pay attention to the order when using multiple inheritance. If there are members with the same name in two classes, the latter one will overwrite the previous one. , that is to say, the current class will only inherit the members of the latter class.
That’s it for call method inheritance. If you don’t know the call method, please ask Google. I won’t go into details. Don’t repost it too much online. Let’s talk about another inheritance method.
Second, prototype prototypal inheritance:
Let’s define a monitor class:
//Squad Leader class
SquadLeader=function (){
//Say hello
this.hi=function(){
alert("Hello, classmates, I am now Squad leader");
}
}
The above defines a master class. Now this master has been promoted to squad leader, so this Master will inherit SquadLeader. This time we use prototype to implement, please see the following code:
Master.prototype=new SquadLeader();//The prototype attribute points to an object
//or
//Master.prototype=SquadLeader.prototype;
In this way, Master inherits SquadLeader Class, that's it. There are two forms here. In fact, the principle is the same. It means: Copy the "soul" of SquadLeader to the Master, so from now on, the Master can do everything the SquadLeader can do.
Test it:
var master=new Master();
master.hi()//Output "Hello, classmates, I am now the monitor"
I personally prefer to use the first solution (call inheritance) to implement inheritance. All codes are wrapped in a "{}", which is clear at a glance. The writing style is closer to C# than the second solution. I usually use the prototype property to extend existing classes.
JavaScript is a very flexible language. There may be other better ways to implement inheritance. You can research and explore. I am just throwing a brick here, hoping to lead to gorgeous jade!