HTML5/JavaScript 編程規范

HTML5/JavaScript 編程規范 
 
一、文本編輯規則 
 
縮進為2個空格，不使用tab 
標簽全部采用小寫字母，如<input type="checkbox" checked> 
函數和變量名稱小寫開頭，中間采用駱駝命名法，如：getElementById(...) 
類似宏的函數名稱全部小寫或大寫，以下劃線分割單詞，如：extend_class__ 
類名稱大寫字母開頭，如 function MyObject(...) 
類中方法、變量按作用域不同，采用不同的命名規則。 
發布的版本一定要注釋掉console.log(...) 
單行注釋總是: /*...*/。多行注釋總是：/**...*/。短注釋用：// 
以//?開頭的注釋總是屬於未完成的臨時代碼 
給屬性添加的注釋：//@attributeName 
 
二、類中方法、變量命名規則 
 
對外暴露的類名稱以大寫字母開頭，如MapPoint 
內部使用的類名稱以雙下劃線__開頭加大寫字母，如__ViewPort 
類的公有方法或屬性、變量與函數和變量的命名規則相同，如：mapPoint.getDistance 
類的私有方法或屬性、變量，並且允許被其他內部類訪問，以單下劃線_加小寫字母開頭 
類的外部不能直接訪問的私有方法、變量，以雙下劃線__加小寫字母開頭，如：__salaryAmount 
類的靜態變量以大寫字母開頭，如：MapPoint.MaxRadius 
 
三、一個JavaScript類模板 

1. /*******************************************************************************  
2.  * h5.hs  
3.  *   cheungmine  
4.  ******************************************************************************/  
5. // 包含其他js文件  
6. usingScript("utils.js");  
7.   
8. /*******************************************************************************  
9.  * $MyClassBase  
10.  *   Place comments here  
11.  ******************************************************************************/  
12. function MyClassBase() {  
13.   //?TODO:  
14. }  
15.   
16. /*******************************************************************************  
17.  * $MyClass  
18.  *   Place comments here  
19.  * 閉包：  
20.  *   這種公共、私有和特權成員的模式是可行的原因是由於JavaScript有closure閉包。  
21.  *   這意味著類中一個內部的函數總是可以訪問這個函數外部的變量和參數，  
22.  *   甚至在外部的函數返回之後。這是這個語言的一個極其強大的特性。  
23.  *   私有和特權成員只能在對象構造的時候生成。  
24.  *   公共成員可以在任意時刻添加。  
25.  ******************************************************************************/  
26. // extend_class__ 聲明 MyClass 繼承自 MyClassBase  
27. extend_class__(MyClass, MyClassBase);  
28. function MyClass(/* 可以在此放置構造參數列表 */) {  
29.   // 另一種繼承類的方法，可以提供不同的構造參數  
30.   // 不要與extend_class__同時使用  
31.   // MyClassBase.call(this);  
32.   
33.   /*************  
34.    * 私有成員：*  
35.    ************/  
36.   // 可變參數示例，__args是嚴格私有變量  
37.   var __args=Array.prototype.slice.call(arguments);  
38.   
39.   var __salary = 0;  
40.   
41.   // 下面是一個私有方法示例，外部不能訪問  
42.   function __parseArgs() {  
43.     self.__salary = 0;  
44.     if (__args.length>=2) {  
45.       this._family = __args[0];  
46.       this.name = __args[1];  
47.       if (__args.length==3)  
48.         self.__salary = __args[2];  
49.       return true;  
50.     }  
51.     return false;  
52.   }  
53.   
54.   /*************  
55.    * 特權成員：*  
56.    ************/  
57.   // toString 提供類名稱  
58.   this.toString = function () {  
59.     return "MyClassClass";  
60.   }  
61.   
62.   this.initialize = function (salary) {  
63.     if (salary!=null)  
64.       this.salaryAmount = salary;  
65.     return __parseArgs();  
66.   }  
67.   
68.   // 這是一個外部訪問的公有方法，輸出構造參數內容  
69.   this.printArgs = function () {  
70.     var i = 0;  
71.     for (i=0; i<__args.length; i++)  
72.       console.log(__args[i]);  
73.   }  
74.   
75.   /**  
76.    * 公共成員，但是因為加了下劃線，說明我們本意不想被外部直接訪問  
77.    * 但允許內部類訪問  
78.    */  
79.   this._family = null;  
80.     
81.   /**  
82.    * 公共成員，外部直接訪問  
83.    */  
84.   this.name = null;  
85.   
86.   /*************  
87.    * 特權屬性: *  
88.    ************/  
89.   //@valid  
90.   this.__defineGetter__("valid",  
91.     function () {  
92.       return (this._family!=null && this.name!=null);  
93.     }  
94.   );  
95.   
96.   //@salaryAmount  
97.   this.__defineSetter__("salaryAmount",  
98.     function (v) {  
99.       __salary=v*100;  
100.     }  
101.   );  
102.   
103.   /**  
104.    * 放在最後一行，self被內部方法使用  
105.    */  
106.   var self = this;  
107. }  
108. // 下面是類靜態變量的例子:  
109. MyClass.prototype.DaysOfYear = 365;