JavaScript 程式碼風格指南

一.基本格式

縮排

建議每級4個空格，可以給編輯器設定tab = 4個空格，自動轉換

分號

不要省略分號，防止ASI（自動插入分號）錯誤

行寬

每行程式碼不超過80個字元，過長應該用操作符手動斷行

斷行

操作符在上一行末尾，且下一行縮排2級，如果是賦值語句，還應該和等號後面部分對齊

空行

函式宣告與函式宣告、變數宣告與函式宣告、函式內部的邏輯塊之間都應該有空行隔開

作者尼古拉斯還建議在流程控制塊頂部留一個空行，但給的例子不是很明確

命名

• 變數名/函式名：Camel（駝峰）規則，首詞首字母小寫，後續詞首字母大寫，其餘部分小寫
• 常量名：C語言式，全大寫，下劃線分詞
• 建構函式：Pascal規則，所有詞首字母大寫，其餘部分小寫

字面量

• 字串：雙引號包裹，斷行用[+]操作符，不要用\轉義字元
• 數值：不要省略小數點前後的部分，不要用八進位制形式
• Null：只把null當作Object的佔位符，不要用來檢測形參，也不要用來檢測未初始化的變數
• Undefined：應該把所有物件都初始化為null，以區分未定義和未初始化
• 物件字面量/陣列字面量：不要用建構函式方式宣告物件和陣列

二.註釋

P.S.書中有一句非常經典的解釋：

Appropriately written comments help tell the story of code, allowing other developers to drop into a part of the story without needing to hear the beginning.

單行註釋

• 行尾：用1級縮排隔開程式碼，而且//後面要有一個空格
• 獨佔一行：用來註釋下面，要與被註釋的程式碼保持相同的縮排
• 行首：用來註釋多行程式碼

多行註釋

用來包裹大段註釋，推薦Eclipse風格，例如

/*
 * comment line1
 * comment line2
 */

注意：

• 多行註釋上方留一個空行
• *星號後面留一個空格
• 多行註釋至少三行（因為第一行和最後一行後面不加註釋）

在哪裡添註釋

• 不能自解釋的程式碼
• 故意的，但看起來像是有錯的地方
• 針對瀏覽器的hack

文件註釋

應該給各個函式添註釋，包括功能描述、引數、返回值、丟擲的錯誤等等，例如推薦的Eclipse風格：

/**
 * 新增指定元素到預設陣列
 *
 * @method add
 * @param {Number} 將要新增的元素
 * @return {Boolean} 新增成功/失敗
 * @throw {TypeError} 引數型別不匹配
 */
function add(item){
    if(typeof item === "number"){
        arr.push(item)
    }
    else{
        throw new TypeError();
    }
}

三.語句和表示式

花括號對齊方式

建議行尾風格，不推薦次行風格

塊語句空格

if後的圓括號部分前後各有一個空格，例如：

if (expr) {
    code
}

switch語句

• 縮排：case與switch對齊，break縮排1級
• case貫穿：用空行或註釋//falls through表明case貫穿是故意的
• default：保留default或者用註釋//no default表明沒有default

P.S.《JavaScript語言精粹》的作者道格拉斯認為不應該用case貫穿（稱之為雞肋），因為極易引發bug，而尼古拉斯認為用空行或者註釋說明就好了

with語句

不用

for迴圈

所有變數都應該在函式體頂部宣告，包括for迴圈初始化部分用到的變數，避免hosting（提升）引發bug（可能會遮蔽全域性變數）

for-in迴圈

不要用來遍歷陣列，用的時候記得加上hasOwnProperty過濾，如果故意遍歷原型屬性，應該用註釋說明

四.變數、函式、操作符

變數宣告

函式體 = 變數宣告 + 函式宣告 + 邏輯語句。用空行隔開各個部分

函式宣告

先宣告再使用，千萬不要把函式宣告放在if分支裡，因為瀏覽器理解不同，而且ES沒給標準

函式呼叫

圓括號前後都不加空格，避免和塊語句混淆

匿名函式立即執行

把立即執行的匿名函式用圓括號包裹，避免與匿名函式宣告混淆

嚴格模式

不要在全域性作用域開嚴格模式，只在函式內部開，給多個函式開可以用匿名函式立即執行限定嚴格模式的作用域

判斷等於

只用===和!==

eval

不用eval()和new Function()，用匿名函式優化setTimeout()和setInterval()

基本包裝型別

不要用new Boolean(), new String(), new Number()

參考資料

• 《Maintainable JavaScript》
• 《JavaScript語言精粹》