The class definition is mentioned above. Prototype distinguishes functions from classes by using a global object class. Since it is a class, there is an abstract class, a specific class, and class inheritance. At the same time, the class members can have instance members and static members. Let's take a look at how prototype achieves this. (For more information, see www.x2design.net) First read the following code in prototype: var abstract = new object (); object. extend = function (destination, source) {for (property in source) {destination [property] = source [property];} return destination;} object. prototype. extend = function (object) {return object. extend. apply (this, [This, object]);} the first one declares an object abstract. An object is actually a function and has no members. Therefore, it is an empty class, so abstract has no members. This is the basis of the abstract class. First, explain the following syntax: function. member = function () {} in this case, the function is generally defined. The purpose of this statement is to add a static member Member to the function, the content of member is after the equal sign. For example, the second code above is object. Extend = ......, It adds a static method extend to the object class. Okay. Now that we know how to define static members for a class, you must be very curious about how to define the instance members. It is very easy to add prototype: function between the class name and the member name. prototype. member = function () {} prototype can not only be used in this way, but also: function. prototype = {member1: function (){......}, Member2: "ABC", member3: function (){......}} This defines the instance members. But what does prototype mean? As I said in the first article, it is directly included in {} to represent an object, such as prototype and class, which are global objects defined in this way. In the following usage, prototype is followed by a {} structure. Is prototype also an object? Yes, no error. prototype is actually an object! In JavaScript, we can add any member of an object, and use the following syntax: object. Member = function (){......}; After such definition, an object can immediately use the member method! Javascript is so amazing! Well, now we know that prototype is an object, and function is a function or class. We can think that prototype is a static member retained internally by any class (function. Its function is to store all member pointers of this class, but these members are only prototype and are not initialized. This is also in line with prototype. You can use the prototype object to expand members at any time. When a new class is created, prototype members are initialized and assigned to the instantiated object. The third code above is object. Prototype. Extend = ......, This is to add an instance method extend to the object. The instance method can reference this pointer and point to the object instantiated by this class. Of course, this object has the extend Member. Before proceeding, let's take a look at two statements: For (var p in object) {} method. apply (object, arguments); the first sentence is to list all the members of a variable. If it is a function, it is all static members. If it is an object, it is all instance members, the p type is a string. The name of the member. A member can use not only variabel. Member, but also variabel ["member"]. In turn, assignment is also true. This makes it easy to enumerate members of a variable. The second statement: apply the method to the object for execution. The parameter is the arguments array. Note: The method is not a member of the object. However, we can think that the execution of this statement means: object. Method (arguments ). This is a very important method, which will be frequently used later and you will gradually become familiar with it. Next, let's continue with Extend. It is a very important method. We can see that it is both a static member of the class object and a member of its instance. What does it do? Let's take a look: it receives two parameters: destination and source. If destination and source are both classes, its function is to reset all static members of class source to class destination, if destination and source are both objects, all instance members are copied. If a member with the same name already exists in destination, the member will be overwritten. That is to say, Let destination have all the members of the source, and the function returns this destination. Let's take a look at extend as an instance Member of the object: object. prototype. extend = function (object) {return object. extend. apply (this, [This, object]);} is a bit dizzy at first, But don't worry, you can still understand it. The apply syntax has just been mentioned, and its caller is a method, object. extend is a static method. It is applied to this, that is, the object instance. If it is OBJ, square brackets are an array that contains two members, this and object. This array is actually the arguments parameter of the object static member extend. This statement is equivalent to executing obj. Extend (this, object); this does not explain, it indicates itself. What is an object? Parameter. Well, it is a parameter sent from the instance method extend. Do not confuse it. What about extend? OBJ does not define extend instance members, but with apply, it can use the object's static extend Member. Let's look at the extend function body: object. extend = function (destination, source) {for (property in source) {destination [property] = source [property];} return destination;} Because obj is an object, and object is also an object, that is, destination and source are both objects, so the function is to make OBJ have all the members of the object. And obj is returned. It sounds a bit difficult, but the logic is simple: Let OBJ "inherit" object! Well, we have seen inheritance, but you will certainly ask, for the first time, we heard that inheritance is about class inheritance. Yes, I do not see the real class inheritance yet, but it is close at hand: Isn't there a prototype for a class, and prototype is an object! Well, the inheritance syntax of the class seems very simple: B. Prototype. Extend (A. Prototype); Let B inherit. The fact is not that simple: Prototype is used to store the method prototype pointer. The extend method is not initialized and cannot be used! To use extend, you must instantiate an object. Let's take a look at how prototype is implemented: B. Prototype = (new A (). Extend (B. Prototype); very clever way! It fully demonstrates that a function is actually a variable. Instantiate the Object first, then call extend based on it, overwrite all member B. Prototype members to the object, and then assign the object to B. prototype. Completed B's work inherited from. Generally, B. prototype = (new ()). extend ({}); because B is inherited from a, B is usually an undefined class before B, so class members can be defined in. Of course, you can also define and inherit first, but it is different from the traditional concept. OK. I am tired of writing it here today. It is estimated that the person who looks at it is also, haha. Now we have basically understood the prototype class development framework. You can read some advanced applications. See you next round. :) <script language = "JavaScript"> // Add the static method extend to the object, the method as a replication source has all attributes and methods to destinationobject. extend = function (destination, source) {for (property in source) {destination [property] = source [property];} return destination;} var dog = function (name) {This. name = Name;} // copy the printname Method to the dog. prototypeobject. extend (dog. prototype, {printname: function () {alert (this. name) ;}}); var A = new dog ("dog");. printname (); </SCRIPT>
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 person
Copy 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 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!