Today to use JS to implement a number of client functions, taking into account the business logic, using OO development method will be very convenient, so carefully reviewed the relevant articles, some experience.
The first is to define the class. In JS, the class is defined using a function, instantiated using the new operator:
function class1() {
this.a = 'class1';
this.m1 = function() {
alert('class1.m1');
}
}
class1.prototype.m2 = function() {
alert('class1.m2');
}
var c1 = new class1();
In JS, function and object is the two most basic class, any object, instance, function in JS is also an instance of function and object, which can be verified with instanceof, this has special function, some of the magic behind it is supported by this point.
A function has two uses, one like the above, the other in a common form, and the other is dynamic creation at run time, such as
var add = new Function("x", "y", "return (x+y)");
The result created is a function object. This can explain the "strange" usage I've seen before. As above, this.m1 = function () {...} In practice, the following function sentence automatically generates an anonymous function object and assigns it to the M1 property, and then Class1 has the M1 method. Then use class1.prototype.m2 = function () {...} The sentence defines the M2 method, and it actually gets the anonymous function object and assigns it to the M2 property. Of course, the form of these two definitions is distinguished, which is described later. Since you get an object, you can use the variable to refer to, of course, as a function call parameters, you can easily and naturally implement the function callback. This is more natural than implementing callbacks in languages like C #.
In this case, the JS class can define attributes when defined, such as the A attribute in the example. In addition, the properties of an instance can be added dynamically. If you use c1.b = ' B ', C1 automatically has property B. This dynamically added property does not spread to other instances, that is, if there is another instance C2, C2 still has only property A and no property B.
As in the example above, the functions of any class (Class1) are implemented in two ways, one inline, that is, when the function is defined, the method is written in the body, and the other is the use of prototype, which can be defined anywhere. For an instance of a class (Class1 instance C1), you also have methods that are defined in both ways. Because the inline definition has high precedence, when the instance invokes the method, it first looks for the inline definition, and then it turns to the definition of prototype to find it. Therefore, the method defined by prototype is overwritten by the inline definition. If a method overlay is really occurring, there are at least two ways to use the method defined by prototype (the following assumption Class1 uses both of these forms to define the method M1).
The first is to use delete, first delete the M1 method, according to the priority, the natural delete is the inline M1 method. What, do not understand why can also delete the method? First of all. JS is a dynamic language; second, remember that the method is only a function instance, which is only a special attribute in Class1.
var c1 = new class1();
delete c1.m1; //去掉内联的m1方法
c1.m1(); //调用prototype的m1方法
The second option is to use the Apply method. For the use of apply, you can view the JS manual.
var c1 = new class1();
class1.prototype.m.apply(c1); //使用prototype中定义的m方法代替c1的m方法
The object instantiated with new is still both a function object and an object object, including all instance properties and methods of both. It's not very well understood, think, that the class we define is both a function object and an instance of an Object object, and then instantiated, the instance is also an instance of the function object and the object object, is there a bit like father and son's father is the same person? Oh, a bit disgusting, but also hope that the master out detailed analysis of the function object and object and JS inside the type relationship.
Here's a comparison of JS and Ruby. Both JS and Ruby have a default global object, and JS is a global object, and the defined global variables and functions are members of global. From this point of view, JS also has a bit of OO sense (at least formal):-). In Ruby, both class variables and instance variables exist, as is JS. This design is the advantage of scripting language, you can change the definition of class at any time at run time, very flexible and powerful. At the same time, all types in both scripts are not closed, but open, and users can add additional properties and methods to all types built into the language.
Another fun topic: the reflection of JS. Any object (function and object) in JS can traverse all members by using the following methods:
var info = typeof(obj)+'\n';
for(p in obj) {
info += p + '\n';
}
alert(info);
Similarly, using reflection, you can invoke methods and properties in this way:
alert(c1['a']);
c1['m1']();