JavaScript Object-oriented features reference

Recently looking at using JAVASCRIPT+CSS to implement rich client. JavaScript is also a pretty interesting language. In particular, its object-oriented implementation and other "standard" oo launguage are very different. However, it is a dynamic language, and I still think it is far worse than the Python syntax and library. But there is no explorer to support python development ah ... ：（

This is a summary of my study of object-oriented features in JavaScript. You want to be helpful to a friend with object-oriented design experience in other languages to understand JavaScript oo. I have experience in object-oriented design for C++,java and Python.

Overall feeling, JavaScript is a weak type of dynamic language, syntax is close to Java, but its object-oriented approach to Python acquaintance.

1 Object-oriented features

class, member variable, member function, class variable, class method, inheritance, polymorphic

1 ) class

Definition of class: function Circle (r) {THIS.R = R;}

The instantiation of the class: c = Circle (3);

2 ) member Variables

The member variable is declared in the initialization function: THIS.R = r;

Note that after the object is generated, you can also attach member variables to it, such as c.name= "My Circle",

But unless there is a special need, I strongly advise you not to do so. That is, all members should be declared in the initialization function. I think it's a good style.

This is very familiar with Python.

3 ) member functions

The standard form of a member function is this:

Cricle.prototype.area = function () {return 3.14 * THIS.R * THIS.R;}

This is very different from Java or Python or C + +. But to help understand, you can think of prototype as a base class.

The variable or method inside the prototype is shared by all objects.

For example, the C.area () call will eventually make the interpreter call to Circle.prototype.area ().

Compared to Java and C++,javascript have a semantics they don't have, that is, you can define variables in prototype. Variables defined in the prototype can be shared by all instances. So generally it should be a constant, for example: Circle.prototype.PI = 3.14.

Obviously, the variables and methods in the prototype should be constant. Each object instance should not be modified to modify the contents of the prototype. While the language allows you to do this, it makes no sense and violates the object-oriented semantics (think that Java will let you dynamically modify a method of a class).

Of course, for polymorphism is another matter, in detail later.

Furthermore, I recommend that all member functions be defined in the same place immediately as the class definition. Instead of adding/modifying member functions to an object instance somewhere where the code is running. The result is that JavaScript's class definition is as consistent as possible to Java. Make the code clearer.

4 ) class variable

A class variable is a variable that belongs to a class. Like a static modified variable in Java. Because it belongs to a class, it should also be a constant. The instance should not modify it, although you can (in Java you can use the final decoration, so that once the class variable is defined, it cannot be modified). As you can see, the functions of class variables and variables defined in prototype are similar. Indeed, their purpose is the same. But the way they visit

Not the same. Like what:

Circle.prototype.PI = 3.14;

Circle.pi = 3.14;

// with prototype the variables in

CIRCLE.PROTOTYPE.AREA1 = function () {return this. PI * THIS.R * THIS.R; }

// using class variables

CIRCLE.PROTOTYPE.AREA2 = function () {return CIRCLE.PI * THIS.R * THIS.R;}

5 ) class method

This concept should be very simple. Note that the This keyword is absolutely not used in class methods and is identical to Java.

Circle.max = function (A, b) {
Return A.R > B.R? A:B;
}

Themax = Circle (New Circle (1), New Circle (4));

6 ) Inherit

Subclass inherits the parent class, the subclass instance has exactly the same behavior as the parent class instance. JavaScript is implemented in this way.

function subcircle (x, Y, R) {
this.x = x;
This.y = y;
THIS.R =r;
}

Subcircle.prototype = new Circle (0);
Remember what you said earlier? You can think of prototype as a base class. Here, prototype is indeed a base class. How is it implemented?

Examples are as follows:
sc = Subcirlce (1,1,3);
Sc.area ();

Delivery of the call:
Sc.area ()->sc.prototype.area ()->circle (0). Area ()->circle.prototype.area ().
It seems that is not very wonderful.

In this way, JavaScript implements inheritance.

7 ) polymorphic

Polymorphism is a method in which subclasses define and parent classes have the same signature. Assume that the space in which the subcircle resides is pi=100, and the area formula becomes pi*r*r*r.

SubCircle.prototype.PI = 100

SubCircle.prototype.area = function () {
return this. PI*THIS.R*THIS.R*THIS.R;
}
Sc.area ()

Such an operation can be considered as:

Sc.pi->sc.prototype.pi->cricle (0). PI = 100

Sc.area ()->sc.prototype.area ()->circle (0). area.
This time, the calling process is like this

Sc.area ()->sc.prototype.area (), where the interpreter found the area method, so it calls this method.

And Cricle.prototype.area will never be called. The same is true for PI calls. So how do the subclasses want to invoke the parent class's methods? There seems to be no way, oh, who knows can tell me. But the object-oriented theory tells us that inheritance is primarily about providing interfaces rather than code reuse, so it is still rare to think that this is good:).

Here is an example program. Contains all of the above concepts.
Example
define:cricle//////////////////
function Circle (r) {
THIS.R = R;
}
Circle.pi = 3.14;
Circle.prototype.PI = 3.14;
Circle.prototype.area = function () {return CIRCLE.PI*THIS.R*THIS.R;}
CIRCLE.PROTOTYPE.AREA2 = function () {return this. PI*THIS.R*THIS.R; }

Test
c = new Circle (3);
Alert ("Area1:" +c.area ());
Alert ("AREA2:" +c.area2 ());

Circle.max = function (A, b) {return A.R>B.R? A.R:B.R;}
Alert ("Max is" +circle.max (New Circle (1), New Circle (3));

C1 = new Circle (1);
C2 = new Circle (1);
C2. PI = 100;//circle.prototype.pi=100;

Alert ("C1.area1" +c1.area ());
Alert ("C1.area2" +c1.area2 ());
Alert ("C2.area1" +c2.area ());
Alert ("C2.area2" +c2.area2 ());

Define:subcircle//////////////////
function subcircle (x, Y, R) {
this.x = x;
This.y = y;
THIS.R = R;
}
Subcircle.prototype = new Circle (0);
SubCircle.prototype.PI = 100;
SubCircle.prototype.move2 = function (x, y) {this.x = x; this.y = y;}
SubCircle.prototype.area = function () {return this. PI*THIS.R*THIS.R*THIS.R; }

Test
sc = new subcircle (0,0,2);

Alert (Sc.area ());

JavaScript Object-oriented features reference