前端編碼規範

規範有什麼用？

能讓每個人出乎意料的輕鬆的閱讀任意一段代碼，並輕易的看懂它們

• 風格高度統一

• 提升可讀性，促進團隊協做

• 下降維護成本 （減小馬良的粗口）

• 有助於寫出質量更高、錯誤更少、更易於維護的程序

原則

不管團隊人數多少，代碼應該同出一門。

約定

1. Tab縮進==四個空格

2. 每行代碼字符數不超過120個

3. 文件使用UTF-8編碼

4. 儘量不寫註釋，除非頗有必要

5. 文件不能留有多餘的空格、換行、沒必要要的註釋

6. 代碼必定要格式化

命名

1. 項目命名：所有采用小寫方式， 如下劃線分隔
   例：my_project_name

2. 目錄命名：參考項目命名，有複數結構時，要採用複數命名法。
   例：scripts, styles, images, templates

3. 文件命名：全小寫，如下劃線分隔

   例：image_preview.js
   如過項目是MVC結構，文件命名能夠帶上當前模塊，便於搜索和理解
   app/scripts/controllers/login.controller.js
   app/scripts/services/login.service.js

4. HTML、CSS文件命名參考如上

5. 語義化，準確的表達意圖

JS編寫規範

1. 變量命名：駝峯命名法，小寫字母開頭。必須聲明

2. 函數命名：駝峯命名法，小寫字母開頭。規則：動詞或動詞+名詞組合

   let removeSession = function() {}
   let getUser = function() {}
   let isAdmin = function() {}
   let findMessagesByIdentifier = function() {}

3. 類命名：駝峯命名法，首字母大寫

4. 每行代碼結束必須有分號;

5. 常量用全大寫字母，下劃線分割，如const HTTP_SUCCESS = 200;

6. 空格，該有的空格的地方按代碼格式化的標準

7. 花括號

   例：if (xx) {
          // do something
      }
   標準寫法，其餘都不規範，不容許if縮寫

8. 使用單引號

   let name = '張三';

9. 使用三目等，用===, !==代替==, !=；

10. 嚴格模式，在js文件頭部聲明

    'use strict';

11. 一個function超過100行就必需要重構，10行內是比較理想的

12. 一個文件只幹一件事，文件行數不超過200行，不然說明模塊化程度不夠

13. 去除else

    例 if (xxx) {
           return;
       }
       // do something
       
    例 if (xxx) {
           // do something
           return;
       }
       if (xxx) {
           // do something
           return;
       }
       // do something

14. 函數參數不能超過3個，可以使用對象代替

15. 一個值在代碼上出現2次以上就須要提取爲常量，防止散彈式編程

HTML編寫規範

1. 屬性值必修雙引號，禁止使用單引號

2. 樣式儘量寫到style文件

參考：https://github.com/fex-team/styleguide/blob/master/html.md

CSS編寫規範

參考：https://github.com/fex-team/styleguide/blob/master/css.md

咱們須要正規軍，沒有作到，那就是完全的土匪軍