[Original] Analysis of the Relationship between JavaScript relay and prototype

Javascript Supports class definition, and the definition method is basically the same as that of the function.

1 Function Out (VAL) {
2Document. Write (Val+"<Br>");
3} ;
4
5 Function Baseclass () {
6This.="I'm baseclass..";
7} ;

The content of the first line can be regarded as a function, and the fifth line can be regarded as a class.

Let's continue. Now let's take a look at the inheritance in JavaScript and the relationship between prototype and inheritance. Let's take a look at the followingCode. Can you come up with the running result?

1 < Script >
2 // Author: Http://meil.livebaby.cn
3 Function Out (VAL ){
4 Document. Write (Val + " <Br> " );
5 };
6
7 Function Baseclass (){
8 This . = " I'm baseclass.. " ;
9 };
10 Baseclass. Prototype. B = " I'm baseclass. Prototype. B. " ;
11 Baseclass. c = " I'm baseclass. C. " ;
12
13 VaR Cls1 = Function (){
14 This . = " I'm cls1.a. " ;
15 };
16 Cls1.prototype. B = " I'm cls1.prototype. B. " ;
17 Cls1.c = " I'm cls1.c. " ;
18
19 VaR Cls2 = Function (){};
20 Cls2.prototype = Cls1.prototype;
21
22 Out ( " Baseclass <br> " );
23 Out (( New Baseclass). );
24 Out (( New Baseclass). B );
25 Out (( New Baseclass). C );
26 Out (baseclass. C );
27 Out ( " <HR> " );
28
29 Out ( " Cls1 <br> " );
30 Out (cls1.a );
31 Out (cls1. B );
32 Out (cls1.c );
33 Out ( " <HR> " );
34
35 Out ( " New cls1 <br> " );
36 Out (( New Cls1). );
37 Out (( New Cls1). B );
38 Out (( New Cls1). C );
39 Out ( " <HR> " );
40
41 Out ( " Cls2 <br> " );
42 Out (( New Cls2). );
43 Out (( New Cls2). B );
44 Out (( New Cls2). C );
45
46 </ Script >

Running result:

Baseclass

I'm baseclass..
I'm baseclass. Prototype. B.
Undefined
I'm baseclass. C.

 

Cls1

Undefined
Undefined
I'm cls1.c.

 

New cls1

I'm cls1.a.
I'm cls1.prototype. B.
Undefined

 

Cls2

Undefined
I'm cls1.prototype. B.
Undefined

Haha! A little dizzy !? It seems different.

The following is an analysis:

1. First look at these lines:
22 Out ( " Baseclass <br> " );
23 Out (( New Baseclass). );
24 Out (( New Baseclass). B );
25 Out (( New Baseclass). C );
26 Out (baseclass. C );
27 Out ( " <HR> " );

Row 25 calls the C attribute of the object, which is not defined in the class, so "undefined"
26 rows are called directly. The static attributes of the class are displayed normally.
Everyone else should have understood it.

2. Continue
30 Out (cls1.a );
31 Out (cls1. B );
32 Out (cls1.c );

First of all, we should know that cls1 is a class here. Cls1 has only one static attribute, namely C. Other attributes can only be accessed through its objects. I'm sorry to use the class name for access. If I cannot find it, I can only display "undefined". The following code is clear.

3. Continue
36 Out ((NewCls1). );
37 Out ((NewCls1). B );
38 Out ((NewCls1). C );

Didn't you say you had to use object access? I'm new. Can this be done? Well! No problem?
But it's not okay --Out ((NewCls1). c); that is the static attribute of the class.32 Out (cls1.c); OK.

4. Continue
41 Out ("Cls2 <br>");
42 Out ((NewCls2). );
43 Out ((NewCls2). B );
44 Out ((NewCls2). C );

This result is a bit confusing. Please wait. Let's see how we wrote it.

Cls2.prototype = cls1.prototype;

Oh! Inherited using prototype, right!
A cannot be inherited, and C cannot be static.

5. Add some content to give you a better understanding of the features inherited from JavaScript. 1 VaR Cls3 = Function (){};
2 Cls3.prototype = Baseclass. Prototype;
3
4 Cls3.prototype. d = " I'm cls3 "
5 Out (( New Cls3). d );
6 Out (( New Baseclass). d );

Running result:
I'm cls3
I'm cls3

Attributes of the parent object can be changed in the original subclass object! Strong !!! Haha!

End!