Daily required javascript inheritance _ javascript skills

Source: Internet
Author: User
Tags what inheritance
Every day, javascript will learn about inheritance and introduce the inheritance-related content. If you are interested, please refer to our friends. Today we will continue to explain the previous encapsulation, today, we are upgrading the content above. In OOP thinking, we will first explain what inheritance actually means and where we will continue to use it.

Inheritance is a series of attributes and behaviors of the descendant's ancestor. The descendant is still the same as the ancestor. Next we will use some specific descriptions to understand what inheritance is.

Both Chinese and Americans inherit from the human ancestor, so we have the same property behavior, but there are some differences. We will continue to talk about polymorphism later, so through the above example, we can clearly understand that people are similar to people before, so let's look at the sample code below and we will know that we use code to simulate inheritance, we can also find a way to write as much code as possible.

// Genetic inheritance function Extend (Children, Parent) {// here, only the behavior defined by the inherited prototype link is for (var p in Parent. prototype) {Children [p] = Parent. prototype [p] ;}// function Human () {this. weight = "50 kg"; this. height = "180"; this. hair = "brown";} // eat Human. prototype. eat = function () {console. log ("eat");} // speak to Human. prototype. say = function () {console. log ("Hello everyone, I am a person on earth");} // walk Human. prototype. walk = function () {console. log ("I am a Human, born to walk upright on two legs");} // multiply Human. prototype. multiply = function () {console. log ("shame with my wife, just for the prosperity of mankind");} // Chinese function Chinese () {// call the inherited function Extend (this, human);} // American function American () {// call the inherited function Extend (this, Human );}

In this way, we simulate the inheritance in the advanced language. Let's see if there is any problem after running.

After running, we found the problem. In this way, we can inherit the prototype link and save a lot of code. When we write Chinese and American functions, if we only write a small amount of code, we will inherit the behavior of the parent class, And the instance can also call the behavior functions owned by the parent class, but this write, we haven't fully implemented inheritance yet, because we didn't play a role when calling the hair attribute, so we can modify the code to implement full inheritance.

// Genetic inheritance function Extend (Children, Parent) {// now we inherit from the Parent class instance, so all attributes and methods will be inherited for (var p in Parent) {if (typeof Children [p] = "undefined") {Children [p] = Parent [p] ;}}// function Human () {this. weight = "50 kg"; this. height = "180"; this. hair = "brown";} // eat Human. prototype. eat = function () {console. log ("eat");} // speak to Human. prototype. say = function () {console. log ("Hello everyone, I am a person on earth");} // walk Human. prototype. walk = function () {console. log ("I am a Human, born to walk upright on two legs");} // multiply Human. prototype. multiply = function () {console. log ("shame with my wife, just for the prosperity of mankind");} // Chinese function Chinese () {// call the inherited function Extend (this, new Human ();} // American function American () {// call the inherited function Extend (this, new Human ());}

Let's take a look at whether the running effect is the same as we thought?

From the code above, we can easily see that the current inheritance function is actually copying attributes and behaviors from a specific instance of the Human class, so that we can further simulate class inheritance, in the above sentence, I still need to explain it to you.

if(typeof Children[p] == "undefined"){ ...... }

The typeof keyword is actually an operator used to check the type of a variable. If it is undefined, the result is "undefined", so I compared it like this, if the subclass does not define such an attribute or behavior function, it inherits from the parent class (Note: The explanation here is to pave the way for the subsequent polymorphism ).

Next, let's take a look at whether multiple inheritance can be performed. As mentioned above, both Chinese and American classes are inherited from the Human class. Next we will write another class to inherit from the Chinese class.

// Receiver function SiChuanMan () {Extend (this, new Chinese ());}

Now we have written robust inheritance code, which is easy to understand. When declaring a new class, call the inherited function in the constructor, we can implement full inheritance of attributes and behavioral functions, so that we can save a lot of code, and the advantages of OOP are once again reflected, if we want to simulate people in every province in China, if I write in every province according to the Human class, the sun will not be able to write from the sun to the next day. There are many different ways of writing inheritance, and everyone has their own writing. Here, I will explain it to you in the simplest way. When you can use it skillfully later, you can also write it in your favorite way. javascript itself is a flexible language.

To sum up, we have further upgraded on the basis of encapsulation today, so that we can implement object inheritance, and the amount of written code is further compressed. Think about how to improve work efficiency, is it a little excited to improve code elegance? As long as we keep following me, we can understand the most complicated things in the simplest way. In fact, the program is not complicated, the reason for the complexity is that everyone is not properly led. A simple thing is understood and interpreted by different people as different things, so learning is complicated, more is that there is no continuous tutorial step by step to lead everyone to the right direction, so it is difficult to improve for a long time.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.