JavaScript程序編碼規範
2008.01.14 來自：譯言cloudwater 譯 Douglas Crockford
這是一套適用於JavaScript程序的編碼規範。它基於Sun的Java程序編碼規範。但進行了大幅度的修改, 因爲JavaScript不是Java。
這是一套適用於JavaScript程序的編碼規範。它基於Sun的Java程序編碼規範。但進行了大幅度的修改, 因爲JavaScript不是Java。
軟件的長期價值直接源於其編碼質量。在它的整個生命週期裏,一個程序可能會被許多人閱讀或修改。如果一個程序可以清晰的展現出它的結構和特徵,那就能減少在以後對其進行修改時出錯的可能性。
編程規範可以幫助程序員們增加程序的健壯性。
所有的JavaScript代碼都是暴露給公衆的。所以我們更應該保證其質量。
保持整潔很重要。
JavaScript文件
JavaScript程序應獨立保存在後綴名爲.js的文件中。
JavaScript代碼不應該被包含在HTML文件中,除非這是段特定只屬於此部分的代碼。在HTML中的JavaScript代碼會明顯增加文件大小,而且也不能對其進行緩存和壓縮。
filename.js>應儘量放到body的後面。這樣可以減少因爲載入script而造成其他頁面內容載入也被延遲的問題。也沒有必要使用 language或者type屬性。MIME類型是由服務器而非scripttag來決定的。
縮進
縮進的單位爲四個空格。避免使用Tab鍵來縮進(即使現在已經是21世紀了),也始終沒有個統一的Tab長短標準。雖然使用空格會增加文件的大小,但在局域網中幾乎可以忽略,且在 最小化過程中也可被消除掉。
每行長度
避免每行超過80個字符。當一條語句一行寫不下時,請考慮折行。在運算符號,最好是逗號後換行。在運算符後換行可以減少因爲複製粘貼產生的錯誤被分號掩蓋的機率。下一行應該縮進8個空格。
註釋
不要吝嗇註釋。給以後需要理解你的代碼的人們(或許就是你自己)留下信息是非常有用的。註釋應該和它們所註釋的代碼一樣是書寫良好且清晰明瞭。偶爾的小幽默就更不錯了。記得要避免冗長或者情緒化。
及時地更新註釋也很重要。錯誤的註釋會讓程序更加難以閱讀和理解。
讓註釋有意義。重點在解釋那些不容易立即明白的邏輯上。不要把讀者的時間浪費在閱讀類似於:
i = 0; //讓i等於0
使用單行註釋。塊註釋用於註釋正式文檔和無用代碼。
變量聲明
所有的變量必須在使用前進行聲明。JavaScript並不強制必須這麼做,但是這麼做可以讓程序易於閱讀,且也容易發現那些沒聲明的變量(它們會被編譯成全局變量)。
將var語句放在函數的首部。
最好把每個變量的聲明語句單獨放到一行,並加上註釋說明。所有變量按照字母排序。
var currentEntry; // 當前選擇項 var level; // 縮進程度 var size; // 表格大小
JavaScript沒有塊範圍,所以在塊裏面定義變量很容易引起C/C++/Java程序員們的誤解。在函數的首部定義所有的變量。
儘量減少全局變量的使用。不要讓局部變量覆蓋全局變量。
函數聲明
所有的函數在使用前進行聲明。 內函數的聲明跟在var語句的後面。這樣可以幫助判斷哪些變量是在函數範圍內的。
函數名與((左括號)之間不應該有空格。) (右括號)與 開始程序體的{(左大括號)之間應插入一個空格。函數程序體應縮進四個空格。 }(右大括號)與聲明函數的那一行代碼頭部對齊。
function outer(c, d) { var e = c * d; function inner(a, b) { return (e * a) + b; } return inner(0, 1); }
下面這種書寫方式可以在JavaScript中正常使用,因爲在JavaScript中,函數和對象的聲明可以放到任何表達式允許的地方。且它讓內聯函數和混合結構具有最好的可讀性。
function getElementsByClassName(className) { var results = []; walkTheDOM(document.body, function (node) { var a; // 類名數組 var c = node.className; // 節點的類名 var i; // 循環計數器// If the node has a class name, then split it into a list of simple names.// If any of them match the requested name, then append the node to the set of results. if (c) { a = c.split(' '); for (i = 0; i < a.length; i += 1) { if (a[i] === className) { results.push(node); break; } } } }); return results; }
如果函數是匿名函數,則在function和((左括號)之間應有一個空格。如果省略了空格,否則會讓人感覺函數名叫作 function。
div.onclick = function (e) { return false; }; that = { method: function () { return this.datum; }, datum: 0 };
儘量不使用全局函數。
命名
變量名應由26個大小寫字母(A..Z,a..z),10個數字( 0..9),和_(下劃線)組成。避免使用國際化字符(如中文),因爲它們不是在任何地方都可以被方便的閱讀和理解。不要在命名中使用 $(美元符號)或者(反斜槓)。
不要把_(下劃線)作爲變量名的第一個字符。它有時用來表示私有變量,但實際上JavaScript並沒提供私有變量的功能。如果私有變量很重要, 那麼使用私有成員的形式。應避免使用這種容易讓人誤解的命名習慣。
大多數的變量名和方法命應以小寫字母開頭。
必須與 new共同使用的構造函數名應以大寫字母開頭。當new被省略時JavaScript不會有任何編譯錯誤或運行錯誤拋出。忘記加 new時會讓不好的事情發生(比如被當成一般的函數),所以大寫構造函數名是我們來儘量避免這種情況發生的唯一辦法。
全局變量應該全部大寫。(JavaScript沒有宏或者常量,所以不會因此造成誤會)
語句
簡單語句
每一行最多隻包含一條語句。把;(分號)放到每條簡單語句的結尾處。注意一個函數賦值或對象賦值語句也是賦值語句,應該以分號結尾。
JavaScript可以把任何表達式當作一條語句。這很容易隱藏一些錯誤,特別是誤加分號的錯誤。只有在賦值和調用時,表達式才應被當作一條單獨的語句。
複合語句
複合語句是被包含在{ }(大括號)的語句序列。
- 被括起的語句必須多縮進四個空格。
{(左大括號)應在複合語句其實行的結尾處。}(右大括號)應與{(左大括號)的那一行的開頭對齊- 大括號應該在所有複合語句中使用,即使只有一條語句,當它們是控制結構的一部分時, 比如一個
if或者for語句。這樣做可以避免以後添加語句時造成的錯誤。
標示
語句標示是可選的,只有以下語句必須被標示:while, do,for,switch。
return 語句
一條有返回值的return語句不要使用( )(括號)來括住返回值。如果返回表達式,則表達式應與return 關鍵字在同一行,以避免誤加分號錯誤。
if 語句
if語句應如以下格式:
if (condition){statements;
condition
}
if () {statements;
statements;
} else {
condition
}
if () {statements;
condition
} else if () {statements;
statements;
} else {
}
for 語句
for語句應如以下格式:
for (initialization;condition ; update) {statements;
variable
}
for (in object)if (filter) {statements;
}
第一種形式的循環用於已經知道相關參數的數組循環。
第二種形式應用於對象中。object原型中的成員將會被包含在迭代器中。通過預先定義hasOwnProperty方法來區分真正的 object成員是個不錯方法:
for (variablein object) if (object.hasOwnProperty(variable )){statements;
}
while 語句
while語句應如以下格式:
while (condition){statements;
}
do 語句
do語句應如以下格式:
do {statements;
condition
} while ();
不像別的複合語句,do語句總是以;(分號)結尾。
switch 語句
switch語句應如以下格式:
switch (expression){ expression
case:statements;
statements;
default:
}
每個 case與switch對齊。這可避免過分縮進。
每一組statements(除了default應以 break,return,或者throw結尾。不要讓它順次往下執行。
try 語句
try語句應如以下格式:
try {
statements;
} catch (variable){
statements;
}
try {
statements;
} catch (variable){
statements;
} finally {
statements;
}
continue 語句
避免使用continue語句。它很容易使得程序的邏輯過程晦澀難懂。
with 語句
不要使用with語句。
空白
用空行來將邏輯相關的代碼塊分割開可以提高程序的可讀性。
空格應在以下情況時使用:
- 跟在
((左括號)後面的關鍵字應被一個空格隔開。
while (true) {
- 函數參數與
((左括號)之間不應該有空格。這能幫助區分關鍵字和函數調用。 - 所有的二元操作符,除了
.(點) 和((左括號)和[(左方括號)應用空格將其與操作數隔開。 - 一元操作符與其操作數之間不應有空格,除非操作符是個單詞,比如
typeof。 - 每個在控制部分,比如
for語句中的; (分號)後須跟一個空格。 - 每個,(逗號)後應跟一個空格。
另外的建議
{} 和[]
使用{}代替new Object()。使用[]代替new Array()。
當成員名是一組有序的數字時使用數組來保存數據。當成員名是無規律的字符串或其他時使用對象來保存數據。
,(逗號)操作符
避免使用逗號操作符,除非在特定的for 語句的控制部分。(這不包括那些被用在對象定義,數組定義,var語句,和參數列表中的逗號分隔符。)
作用域
在JavaScript中塊沒有域。只有函數有域。不要使用塊,除非在複合語句中。
賦值表達式
避免在if和while語句的條件部分進行賦值。
if (a = b) {
是一條正確語句?或者
if (a == b) {
纔是對的?避免這種不容易判斷對錯的結構。
===和!==操作符。
使用===和!==操作符會相對好點。==和!=操作符會進行類型強制轉換。 特別是, 不要將==用於與錯值比較( false,null,undefined,“”, 0,NaN)。
令人迷惑的加號和減號
小心在+後緊跟+或++。這種形式很容易仍人迷惑。應插入括號以便於理解。
total = subtotal + +myInput.value;
最好能寫成
total = subtotal + (+myInput.value);
這樣+ +不會被誤認爲是++。
eval 是惡魔
eval是JavaScript中最容易被濫用的方法。避免使用它。
eval有別名。不要使用Function構造器。不要給setTimeout或者 setInterval傳遞字符串參數。
