前端規範之javascript規範

小婉發表於2019-06-25
前端JavaScript

其他規範：

HTML 規範

媒體檔案規範

CSS 規範

nodeJs 規範

vue專案規範

JavaScript 是一門弱型別語言，正因如此導致寫法五花八門，這裡整理了一些在編寫程式碼時需要注意的事項

通用規範

檔案編碼

為了避免內容亂碼，統一使用 UTF-8 編碼儲存。

在檔案結尾處，保留一個空行。

程式碼檢測

開啟 eslint 程式碼規範和錯誤檢查。

在嚴格模式模式下編碼

'use strict';
複製程式碼

型別規範

  • js 資料型別有 string、number、boolean、null、undefined、array、function 和 object 這幾種，不同資料型別有不同的儲存方式，也對應有不用的使用方法，對於資料賦值要注意以下幾點

    • 初始值型別要明確
    • 不要隨意變換型別

  • 型別檢測優先使用 typeof。物件型別檢測使用 instanceof。null 或 undefined 的檢測使用 == null。

  • 字串開頭和結束使用單引號 '...string...'

命名規範

  • 變數命名採用小駝峰命名，如:addUser password studentID

  • 常量命名採用單詞所有字母大寫,並用下劃線分隔，如：FORM_NAME

  • 對於物件、函式、和例項採用小駝峰（camelCase）命名法

    // 物件
let isObject = {};
// 函式
function isFun(){
 ...
};
// 例項
let myBbj = new Object();
複製程式碼

  • 對於類命名或者建構函式，採用大駝峰命名 User() DateBase()

    // 類
class Point {
  ...
};

// 建構函式
function User(options) {
  this.name = options.name;
}

let myBbj = new User({
  name: 'yup'
});
複製程式碼

程式碼規範

縮排

統一使用兩個空格縮排，不推薦使用 tap 縮排。

引號

統一使用單引號。

換行

每個獨立語句結束後必須換行。

分號

不得省略語句結束的分號

程式碼塊

使用花括號包裹所有的多行程式碼塊。

單行 if 語句也必須使用花括號括住

// 推薦
if (true) {
  // TODO ...
}
複製程式碼
// 不推薦
if (true) // TODO ...
複製程式碼

使用全等符號

在等號表示式中使用型別嚴格的 ===和!==。使用 === 可以避免等於判斷中隱式的型別轉換。

// 推薦
if (age === 30) {
  // ......
}
複製程式碼
// 不推薦
if (age == 30) {
  // ......
}
複製程式碼

註釋規範

單行註釋

使用 //  作為單行註釋。在評論物件上面另起一行使用單行註釋。在註釋內容前插入一個空格。

// 單行註釋
複製程式碼

多行註釋

以/*開頭，*/結尾，註釋內容前後加一個空格

/*
 * 第一行註釋
 * 第二行註釋
 */
複製程式碼
/* 另外一種寫法 */
複製程式碼

方法註釋

函式(方法)註釋也是多行註釋的一種，但是包含了特殊的註釋要求，關鍵方法必須加註釋。

/**
 * 方法功能描述
 * @param {*} 引數
 * @param {*} 引數
 * @param {*} 引數
 * @param {*} 引數
 * @return 返回值
 */
複製程式碼

TODO 註釋

使用  // TODO:  標註問題的解決方式。

function Calculator() {
  // TODO: total should be configurable by an options param
}
複製程式碼

效能優化

參考JavaScript 效能優化

相關文章