JavaScript的團隊編程規範

本規範是針對javascript函數式編程風格與公司嚴重依賴於jQuery進行編碼的現實制定出來。

禁止使用eval，with與caller(ecma262 v5 的use strict要求)。eval只允許在加密時機器產生。

聲明變數必須加上 var 關鍵字，除了在for(;;)迴圈等語句中，原則上不允許使用連續聲明。因為連 續聲明的效率不如分開聲明高，而且很容易手誤致其暴露到全域範圍下。

常量，全部大寫。

變數名，不能使用拼音，英文單詞以駝峰風格組織起來。

分號，能加的地方都加(基本上除了for, function, if, switch, try, while外)，防止因為這個問題導致壓縮失敗。

自訂類，只能用於UI庫的構建，業務代碼不準私自訂類。

原則上不允許使用偽對象（String, Number，Boolean），直接用其字面量。

原則上不允許使用Array與Object，直接用其字面量[]， {}。

謹慎處理this，防止綁定失效，指向window，建議使用that引用它。

若想調用函數自身，禁止使用命名函數運算式，在目標函數的第一行編寫以下代碼實現,詳解請google 《命名函數運算式揭秘》：

var self = arguments.callee;

禁止擴充原生對象的原型，特別是Object.prototype。

禁止在頁面上對某個元素繫結事件，即下面的代碼風格：

<a href="www.bkjia.com" jump="bbb" onclick="goto(this.jump)">幫客之家</a>

禁止使用IE的條件注釋，一壓縮就沒有了。

var f = function () {    /*@cc_on if (@_jscript) { return 2* @*/  3; /*@ } @*/};

禁止塊內函式宣告，詳解請google《命名函數運算式揭秘》。

if (x) { //ng  function foo() {}} if (x) {  var foo = function() {}}

for-in 迴圈只能用於object。

禁止使用多行字串，因為在編譯時間, 不能忽略行起始位置的空白字元; "\" 後的空白字元會產生奇 怪的錯誤; 雖然大多數指令碼引擎支援這種寫法, 但它不是 ECMAScript 的標準規範。

var myString = 'A rather long string of English text, an error message \                actually that just keeps going and going -- an error \                message to make the Energizer bunny blush (right through \                those Schwarzenegger shades)! Where was I? Oh yes, \                you\'ve got an error and all the extraneous whitespace is \                just gravy.  Have a nice day.';

原則上不允許字串拼接HTML代碼，請使用前台模板或後台模板。

字串字面量，使用 ' 優於 "。

注釋，使用JSDoc。

每一行不宜過長，寫完一段代碼後請用IDE把它格式化一下。

為元素添加自訂變數，統一使用"data-"首碼，放便與HTML5的"data-*"機制相銜接。

禁止jQuery使用一行以上的鏈式操作，非常難讀。

元素的選擇，多使用ID選取器，類別選取器，標籤選取器，慎用子項目結構偽類與位置偽類(nth- child,:first,:eq,:gt)

在已有jQuery對象搜找附近的元素節點，不建議用使用多級的find尋找，而使用相關的遍曆函數。

JavaScript程式應盡量放到外部的JS檔案中，以便壓縮與緩衝。

標準特性優於非標準特性（如果類庫有提供，優先使用類庫中的函數）。

$("XXXX").find("YYYY").find("ZZZZ"); //ng$("XXXX").next() //或者nextUntil, nextAll, prev, prevAll, prevUntl, children, closest, .siblings

為元素添加事件時，考慮的順序是delegate > live > bind。

jQuery在以下事件中存在問題 change resize mouseenter mouseleave mousewheel，大體上用不了事件代理，像mousewheel事件只能藉助於外掛程式。

不在JS檔案中留下未來確定不再使用的程式碼片段。

凡是被jQuery引用到的ID或類名都應該用js_作為首碼，警示其他人在調整樣式時把它誤刪了。

JS代碼必須置於$$命名空間對象之內，所有函數的執行從main函數開始。

     ;;;$(function(){//...其他用到的變數        var $$ = window.$$ = {          //本頁面私人的輔助函數1          _assist1:function(){           },          //本頁面私人的輔助函數2          _assist2:function(){           },          //本頁面私人的輔助函數3          _assist3:function(){           },          //本頁面私人的輔助函數4          _assist4:function(){           },          //本頁面私人的輔助函數5          _assist5:function(){           },//....更多的私人函數          //功能1          feature1:function(){           },          //功能2          feature2:function(){           },          //功能3          feature3:function(){           },          //功能4          feature4:function(){           },          //功能5          feature5:function(){           },          //從後台擷取的JSON資料統一放到這個對象中，以便其他函數調用          jsons:{},//....更多需求，一個需求對應一個函數          main:function(){            $$.feature1();            $$.feature2();            $$.feature3();            $$.feature4();//....在main主函數中調用它們。          }        }        $$.main();      });

從後台擷取JSON資料的格式統一為

$.getJSON(url,params,function(json){     if(json && json.status === "1"){       $.flash(json.msg);       $$.jsons["xxxx"] = json;//將JSON儲存起來     }else{       $.flash(json.msg,"error")     }});$.post(url,params,function(json){     if(json && json.status === "1"){       $.flash(json.msg);       $$.jsons["xxxx"] = json;     }else{       $.flash(json.msg,"error")     }},"json");

為了實現請求與執行回調相分離，我們使用dependBy函數，這樣就有效避免多層嵌套的回調，讓代碼的易懂性大大提高。

$.dependBy(["list_configs"],$$.jsons,function(){     var json = $$.jsons.ist_configs;     //......其他代碼}); 

暫時想到這麼多，如果你有什麼好建議，不吝賜教。