Today I read rank's JavaScript Script Control topic, and suddenly wanted to sum up some of the ways to write JS components, or some different people's different coding style.
First look at the following prototype:
Copy Code code as follows:
var Class = {
Create:function () {
return function () {this.init.apply (this, arguments);}
}
}
var A = Class.create ();
A.prototype = {
Init:function (msg) {
this.msg = msg;
},
Fn:function () {
alert (this.msg);
}
}
var a = new A ("mymsg");
A.fn ();
If you don't like the big pile of class.create, you can do it too:
Copy Code code as follows:
function A () {}//var a = function () {}
A.prototype = {
Init:function (msg) {
this.msg = msg;
},
Fn:function () {
alert (this.msg);
}
}
var a = new A ();
A.init ("mymsg");
A.fn ();
Of course, you can also put the initialization of this.msg into function A (msg) {this.msg=msg} In In short, you will find that this call is cumbersome and the parameters are fixed and correspond well.
If you are not willing to make a lot of class.create, also do not want to call inconvenient, then the prototype in the var Class = {...} and var A = Class.create (); Get:
Copy Code code as follows:
function A () {
This.init.apply (this, arguments);
}
A.prototype = {
Init:function (msg) {
this.msg = msg;
},
Fn:function () {
alert (this.msg);
}
}
var a = new A ("mymsg");
A.fn ();
It looks a lot cleaner, but if you have a lot of components in your library, each component is written over this.init.apply (this, arguments); If you use Class.create, you write only one class, and then each component executes the class.create (). Of course, each component is written over this.init.apply (this, arguments), there is no bad, or see a person likes. Another way to write the prototype is to put together or separate to write is also a person's preference, out of the packaging angle, the unity of the good, but sometimes more clear apart. For example, A.prototype.init=function (msg) {...} A.prototype.fn=function () {...}
And then someone likes to write components like this:
Copy Code code as follows:
var A = function (msg) {
this.msg = msg;
var _this = this;
var privateFn1 = function () {
alert (_this.msg);
}
var privateFn2 = function () {
alert (_this.msg);
}
return {fn1:privatefn1, fn2:privatefn2};
}
var a = new A ("mymsg");
A.fn1 ();
This way, we must put the object of a constructed this into the temporary variable _this Oh, because at runtime, the PRIVATEFN1 function body This is actually {fn1:...,fn2: ...} Such anonymous objects, you can use This.hasownproperty ("FN1") to test. This is something that makes sense at run time. In addition to this method, each object will have a copy of PrivateFn1 and PRIVATEFN2, which is not very good.
(To be continued, some of the different frameworks will be written below)
Author: jaychow
