Some experiences on writing and inheriting javascript classes

I did not pay attention to a question yesterday. It is said that it was a company interview question. As mentioned above, javascript was used to compile a class and implement some methods. In addition, this class was used to generate some Derived classes, to implement other methods! At this time, some friends will not, so I also found relevant information on the Internet to see if I can find the instructions for writing javascript classes, I found it, but I haven't explained it in detail in many cases. So I have a blog today! Here is only a rough explanation. If you have any problems, please forgive me! Master skipped! Okay. Let's explain it later!

1. Class Construction

Here I construct it with humans as a simple example. The first is Declaration, just like the platform writing method, as shown below:

Function Human () {} This is method 1,

Var Human = function () {} This is method 2. Both of them are acceptable. Let's use the first declaration method: the complete code is as follows:

Function Human (name, age, sex ){

/// <Summary>

/// Here is a simple human class

/// </Summay>

/// <Param name = "name"> name of a person </param>

/// <Param name = "age"> age of a person </param>

/// <Param name = "sex"> gender of a person </param>

// Attribute member of the region class

This. name = name;

This. age = age;

This. sex = sex;

// Endregion

 

// Method of the region class

// This is the internal method defined

This. ShowMsg2 = function (){

/// <Summary>

/// Display a message. A dialog box is displayed, showing the age.

/// </Summary>

Alert (this. age );

}

// Endregion

}

 

This completes the construction of a class. We may also use prototype to add some other methods to this class, so that we can not change the internal structure of this class, change this class as follows:

Human. prototype. ShowMsg = function (){

/// <Summary>

/// This is a class method defined externally by prototype. It displays the age, name, and gender of a person.

/// </Summary>

Alert ("name:" + this. name + ", age:" + this. age. toString () + ", Gender:" + this. sex );

}

　　

In this way, an external method is added! In this way, it can be said that a complete class is completed in this way. Friends can also directly declare it internally and do not have to modify it outside. But the advantage of this method is that, you can modify the class without changing the class prototype. You can add different methods in different places!

2. class inheritance

As we all know, if you write a class, some Derived classes will be used. Therefore, class inheritance is also essential, the declaration of a derived class and the declaration of a base class are actually no different. The slight difference is that within the derived class, the base class constructor is called to implement class inheritance! As follows:

Function Man (name, age ){

/// <Summary>

/// Here is a simple class for a man that inherits the Human class.

/// </Summay>

/// <Param name = "name"> name of a person </param>

/// <Param name = "age"> age of a person </param>

/// <Param name = "sex"> gender of a person </param>

// Here we call the constructors of the base class to implement class inheritance.

Human. call (this, name, age, "Boy ");

// Here is the internal method to override the base class. You can also change the external method defined by the base class through prototype.

This. ShowMsg = function (){

Alert (this. name );

}

}

　　

As you can see, there is also a ShowMsg method, which overwrites the ShowMsg method of the base class. No matter whether the base class method is defined internally or externally, you can override it here. If you use external prototype to override it, you can only override the methods declared by the base class through prototype. For example, the base class has a ShowMsg2 method, I want to modify it, and I use prototype to modify it, as follows:

// Finally, I found that this sentence is optional.

Man. prototype = new Human ();

 

// Here it is used to override the external method of the base class, but the internal method of the base class cannot be changed here

// For example, the base class has a method named ShowMsg2, but this override method is not

// Make this method of the base class take effect,

Man. prototype. ShowMsg2 = function (){

Alert (this. age. toString () + this. name + this. sex );

}

　　

The ShowMsg2 of the base class cannot be overwritten here. Therefore, this rewrite is incorrect and can only be successfully declared and overwritten through the internal declaration of the derived class!

However, the base class has an external declared method named ShowMsg pair No. Here we can rewrite it through the prototype of the derived class, as shown below:

// Here is the external method ShowMsg for rewriting the base class, which can be rewritten here, but note that because it is inside the Man class

// A ShowMsg method has been declared. Therefore, rewriting ShowMsg here is invalid.

// This ShowMsg method will be executed here, but the ShowMsg method declared inside the derived class will be executed. This is the derived class

// Inherit the base class and modify the method of the base class Method

Man. prototype. ShowMsg = function (){

Alert (this. name + this. age. toString () + this. sex );

}

 

But please note that if we declare this ShowMsg method in the derived class, this rewriting method will not be useful here! Special attention!

OK! A simple description is basically completed here! Please forgive me for any faults!

 

This article is from the "Laputaliya" blog