# Javascript規范 ## 1.分號 #### `強制`語句必須都有分號結尾，除了for, function, if, switch, try, while ## 2. 縮進 #### `強制` 使用空格而非Tab來縮進, 一層縮進=4個空格 ## 3. 命名 #### `強制` 常量使用大寫字符, 下劃線連接 ```javascript var SECONDS_IN_A_MINUTE = 60; obj.TEXT_WARNNING = '警告'; ``` #### `強制` 標準變量: 駝峰 ```javascript var myCount = 1; ``` #### `強制` 構造函數: 駝峰且大寫第一個字母 ```javascript function Point(x, y) { this.x = x; this.y = y; } ``` #### `建議` 私有方法: 駝峰且加`_`前綴 ```javascript function MyClass() { var _privateNum; this.getNum = function() { return _privateNum; }; } // 雖然不建議這么寫一個對象(建議用閉包來寫) // 但如果真這么寫了, 請把意圖上不想暴露的變量, 用_開頭 var myCounter = { _count: 1, get: function() { return this._count; } }; ``` #### `建議` 對布爾型的變量, 命名時加`is`,`has`,`can`前綴 #### `強制` 不要使用讓人糊涂的命名 ```javascript var isNotError; var isNotClosed; ``` #### `強制` 當出現以下字符時,統一拼寫 ```javascript var iOSVersion; //iOS var AndroidVersion; //Android var classID,teacherID,mID; //ID var jumpURL; //URL var normalHTML, isXML; //HTML var HTTPHeader; //HTTP //... 待補充 ``` #### `建議` 字符串常量或字面量使用時, 使用單引號而非雙引號 ```javascript var str = '<span class="info">'; str += 'some infomation</span>'; ``` ## 4. 代碼風格 #### `強制` 即使是單行,也需要加花括號 `正確` ```javascript //更建議換行寫 if (isUndead) { grabFire(); } //一定要一行,也必須這樣 if (isUndead) { grabFire(); } ``` `錯誤` ```javascript if (isUndead) grabFire(); ``` #### `強制`操作符前后要有空格分隔 ```javascript //運算符 var a = 1 + 2; var thaco = hit + adjustment - randomFactor; //三元操作符 var num = val ? foo() : bar(); var fn = JSON.parse ? JSON.parse : function() { //... }; ``` #### `強制`對象屬性的冒號前無空格,后跟一個空格 ```javascript var myObject = { propA: 1 }; ``` #### `建議`逗號位置: Last comma `建議` (last comma) ```javascript var foo = 1, bar = 2, baz = 3; var obj = { foo: 1, bar: 2, baz: 3 }; ``` `不推薦` (first comma) ```javascript var foo = 1 , bar = 2 , baz = 3; var obj = { foo: 1 , bar: 2 , baz: 3 }; ``` #### `注意`一定不要多寫逗號了 `錯誤` ```javascript var list = [ {n: 1}, {n: 2}, //<----- 會導致IE報錯, GCC默認參數壓縮也會報錯 ]; ``` #### `建議`function的參數括號: 前后都加一個空格, 若非匿名函數, 則名字和括號之間不再需要空格 ```javascript //匿名函數, function和括號間有空格, 括號和花括號間也有空格 var fn = function (param) { //... } //帶名字的函數, function和括號間有空格, 但插入的名字和括號間就無需再加空格了 function foo() { return "bar"; } ``` #### `建議`條件判斷括號: 前后都加一個空格 `推薦` ```javascript if (true) { //... } while (true) { //... } switch (v) { //... } ``` `不推薦` ```javascript if(true) { //... } while(true) { //... } switch(v) { //... } ``` #### `建議`括號緊挨兩端處不要空格, 中間有逗號, 逗號后加空格 `推薦` ```javascript function fn(arg1, arg2) { //... } var fn = function (arg) { //... } if (true) { //... } else { //... } var arr = [1, 2, 3]; ``` `不推薦` ```javascript function fn( arg1, arg2 ) { //... } var fn = function ( arg ) { //... } if ( true ) { //... } else { //... } var arr = [ 1, 2, 3 ]; ``` #### `建議` if...else 寫法 ```javascript if (condition1) { doSomething1(); } else if (condition2) { doSomething2(); } else { doSomethingElse(); } ``` #### `建議` switch...case 寫法 ```javascript switch (condition) { case "first": // code break; case "third": // code break; default: // code break; } ``` ```javascript switch (condition) { case "first": case "second": //上一行不用加fall though: 兩個case緊挨, jshint不會報錯 // code break; case "third": // code /* falls through */ case "fourth": //上一行必須加, 否則jshint會報錯 // code break; default: // code break; } ``` #### `強制`函數參數過多時的排版: 兩層縮進 `正確` ```javascript var localMonsterRumors = getLocalGossip(inkeeper, localInn, numberOfClerics, pintsOfAlePurchased, charismaAjustment); ``` `錯誤` ```javascript var localMonsterRumors = getLocalGossip(inkeeper, localInn, numberOfClerics, pintsOfAlePurchased, charismaAjustment); ``` #### `建議`采用臨時變量來提高復雜判斷或字符串拼接的可讀性 `錯誤` ```javascript if ( (conditionAA && conditionAB) || (conditionBA && conditionBB) ){ //... } var elem = document.getElementById('charClass-' + charClass + + '_combatStats-' + armorClass + '-' + toHitBonus); ``` `正確` ```javascript var conditionA = conditionAA && conditionAB; var conditionB = conditionBA && conditionBB; if (conditionA || conditionB) { //... } var strChar = 'charClass-' + charClass; var strCombat = 'combatStatus-' + armorClass + '-' + toHitBonus; var elem = document.getElementById(strChar + '_' + strCombat); ``` #### `建議`邏輯塊 之間使用空行 ## 5. 雜項 #### `建議`盡量使用標準方法而不是用非標準方法 例: 優先用string.charAt(3) 而不用 string[3] #### `強制`不要修改內置對象的原型 主要是為了不污染原型從而對外部造成不好的影響 如`Array.prototype`,`Object.prototype` #### `強制`避免 == != 的使用， 用嚴格比較條件 === !== ### for...in #### `建議`對數組遍歷時, 用下標的for循環而非for...in #### `注意`使用for...in時要注意利用hasOwnProperty排除掉可能的原型污染干擾 ### with,eval #### `強制`如非特殊情況, 不允許使用with,eval ### 多行字符串 #### `強制`不要使用轉義字符'\'的方式來寫多行字符串 #### `強制`也不要使用function內注釋再toString的hack來定義和使用多行字符串 ## 保留字 #### `強制`對象的屬性如果是保留字, 請務必使用引號定義,方括號引號引用 `正確` ```javascript var example = { "new": function () {} }; var fn = example['new']; ``` `錯誤` ```javascript var example = { new: function () {} }; var fn = example.new; ``` ## 注釋 #### 單行注釋優先 #### 優先使用單行注釋(即使是需要寫多行), 除了以下情況 #### 優先使用多行注釋的情況 - fileoverview / constructors - public method #### 多行注釋 ```javascript /** * this method is ... * @param {Object} ... * @return {Object} ... */ ``` ## //todo: 大塊注釋怎么寫 ## //todo: switch規避jshint的一種特殊情形