JavaScript 編碼規範

JavaScript 編碼規範

1、命名規範

1. 變量

• 命名方法：小駝峯式命名法（由小寫字母開始，後續每一個單詞首字母都大寫）
• 命名建議：語義化的名詞

• 特殊：
  布爾值變量建議添加符合其含義的前綴動詞

  • is：是否
  • can：能不能
  • has：有沒有

• 示例：

  // 頁面標題
  let pageTitle = "JS命名規範";
  
  // 是否顯示
  let isShow = false;

2. 常量

• 命名方法：所有大寫，用下劃線來分割單詞

3. 函數

• 命名方法：小駝峯式命名法（由小寫字母開始，後續每一個單詞首字母都大寫）
• 命名建議：語義化，前綴爲動詞

• 示例：

  // 獲取列表數據
  function getList() {
      // ...
  }

3. 類（構造函數）

• 命名方法：大駝峯式命名法（由大寫字母開始，後續每一個單詞首字母都大寫）

• 命名建議：語義化的名詞

  class Login {
      // ...
  }

• 實例屬性和方法（遵循變量和函數的命名規範）

  class Login {
      // 實例屬性
      name = "iqeq";
      
      // 實例方法
      login = function () {
          // ...
      }
      
      // 實例方法簡寫
      reset() {
          // ...
      }
  }

• 靜態屬性和方法（遵循變量和函數的命名規範）

  class Login {
      // 靜態屬性
      static description = "登錄業務邏輯";
      
      // 靜態方法
      static log = function () {
          // ...
      }
  }

2、編碼規則

1. 禁止在function中定義同名的變量

若是在一個函數中出現多個同名的參數，後面出現的會覆蓋前面出現的參數。

錯誤代碼示例：

function foo(a, b, a) {
    console.log("value of the second a:", a);
}

正確代碼示例：

function foo(a, b, c) {
    console.log(a, b, c);
}

2. 禁止對在代碼塊中聲明function

錯誤代碼示例：

if (test) {
    function doSomethingElse () {
        // ...
    }
    doSomethingElse();
}

正確代碼示例：

function doSomethingElse () {
    // ...
}
if (test) {
    doSomethingElse();
}

3. 禁止在 return throw continue和break語句後出現不可達代碼

錯誤代碼示例：

function foo() {
    return true;
    console.log("done");
}

function bar() {
    throw new Error("Oops!");
    console.log("done");
}

while(value) {
    break;
    console.log("done");
}

throw new Error("Oops!");
console.log("done");

function baz() {
    if (Math.random() < 0.5) {
        return;
    } else {
        throw new Error();
    }
    console.log("done");
}

4. 禁止對原生對象賦值

錯誤代碼示例：

window = {};
Object = null;
undefined = 1;

5. 禁止從新聲明變量

在JavaScript中，能夠對同一個變量再次聲明。這會使變量實際聲明和定義的位置混亂不堪。

錯誤代碼示例：

var a = 3;
var a = 10;

正確代碼示例:

var a = 3;
// ...
a = 10;

6. 禁止聲明未被使用過的變量

已聲明的變量在代碼裏未被使用過，就像是因爲不完整的重構而致使的遺漏錯誤。這樣的變量增長了代碼量，而且混淆讀者。

錯誤代碼示例：

function test(a) {
    // b變量雖然聲明瞭，但沒被使用
    var b = 1;
    
    return a + 1;
}

持續更新....