Javascript plays with inheritance of one

  • 2020-03-30 02:52:47
  • OfStack

So in Javascript, there are no classes, no inheritance to provide implementation, what do we do?
Object camouflage (construct inheritance)
What is object camouflage? What we might call construct inheritance is a little bit easier to understand. As the name implies, it USES constructors to play inheritance. In other words, if the constructor of the parent class is a normal method, put it into the constructor of the subclass to execute, then when the object is constructed, the object of the subclass can of course construct the method of the parent class.

Again using the above example, the code is as follows:


function Animal() 
{ 
        this.Run=function(){alert("I can run");}; 
} 
function People(name) 
{ 
// In this case, the parent constructor is passed in, and then the parent constructor is executed // You can now use the methods in the parent class.  
        this.father=Animal; 
        this.father(); 
        //Remember to remove it, or it will be changed to the parent class when a subclass is added to a method with the same name as the parent class.
delete this.Father; 
this.name=name; 
        this.Say=function(){alert("My name is "+this.name);} 
} 
function Girl(name,age) 
{ 
        this.father=People; 
        this.father(name); 
        delete this.father; 
        this.age=age; 
        this.Introduce=function(){alert("My name is "+this.name+".I am "+this.age);}; 
} 

In this way, an inheritance chain is implemented.


var a=new Animal(); 
a.Run(); 
var p=new People("Windking"); 
p.Run(); 
p.Say(); 
var g=new Girl("Xuan",22); 
g.Run(); 
g.Say(); 
g.Introduce(); 

The results are as follows:

A. < img Alt = "" border = 0 SRC =" / / files.jb51.net/file_images/article/201405/201405081717142.png ">

B. < img Alt = "" border = 0 SRC =" / / files.jb51.net/file_images/article/201405/201405081717143.png ">

C. < img Alt = "" border = 0 SRC =" / / files.jb51.net/file_images/article/201405/201405081717144.png ">

D. < img Alt = "" border = 0 SRC =" / / files.jb51.net/file_images/article/201405/201405081717145.png ">

E. < img Alt = "" border = 0 SRC =" / / files.jb51.net/file_images/article/201405/201405081717146.png ">

F. < img Alt = "" border = 0 SRC =" / / files.jb51.net/file_images/article/201405/201405081717147.png ">

Test successful!

To summarize the key points of this code, specify the parent class, declare the parent class object, and then delete the temporary variable. At least that's how I feel about it. Once I forget delete, there is also the risk that the parent class will be modified. For this, we use call and apply to improve it!
Then look at the code, again the above example (to make it easier for everyone to understand, change the requirement, Animal has a name) :


function Animal(name) 
{ 
        this.Run=function(){alert("I can Run");}; 
} 
function People(name) 
{ 
        //Inheritance is implemented using the call method
this.father=Animal; 
        this.father.call(this,name); 
        this.name=name; 
        this.SayName=function(){alert("My name is "+this.name;);}; 
} 
function Girl(name,age) 
{ 
        //Use the apply method to implement inheritance
        this.father=People; 
        this.father.apply(this,new Array(name)); 
        this.age=age; 
        this.Introduce=function(){alert("My name is "+this.name+".I am "+this.age);}; 
} 

Use the same test code and find the same success.

If you are a novice, you may feel a little dizzy from the following two pieces of code. What is call and what is apply? Well, I'm adding a supplement series to the topic of playing with inheritance, and if you're not familiar with this, check out my article, playing with methods :call and apply.
Object camouflage is just a way to realize inheritance. In the following article, I will continue to write other inheritance methods and the advantages and disadvantages of several inheritance methods. Please continue to pay attention to them.


Related articles: