HTML5/JavaScript 编程规范

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;