前端規範彙總(參考)

2022-08-23 19:57:13 字數 2007 閱讀 7996

1、命名

兩種書寫方式:

①連詞線 ( - ) 分隔,如content_title;

②駝峰,又分為大駝峰(contenttitle)和小駝峰(contenttitle)。

具體規範:

①檔名:小寫,如包含多個單詞時,單詞之間使用半形的連詞線 ( - ) 分隔;

②元件名:大駝峰,如header.vue;

③class類名:小寫,如包含多個單詞,單詞間使用半形的連詞線 ( - ) 分隔;

④變數名:小駝峰;

⑤常量名:全部大寫,如包含多個單詞,單詞間使用半形的連詞線 ( _) 分隔;

⑤函式名:小駝峰,其中建構函式使用大駝峰;

注意:以上命名必須語義化,並且函式命名時,字首需為動詞,例如can,has,is,get,set等。

2、注釋

兩種方式:

①單行注釋://(雙斜線)與注釋文字之間保留乙個空格

②多行注釋:/ *注釋說明* / 

注意:①若至少三行注釋時,第一行為/*,最後行為*/,其他行以*開始,並且注釋文字與*保留乙個空格。例如:/*

②函式(方法)注釋也是多行注釋的一種,但是包含了特殊的注釋要求,例如:

/** 查詢

3html規範

①標籤語義化,不能全是div、span;

②img標籤中,alt屬性不為空;

①盡量不要寫行內樣式;

③盡量不使用嵌入式樣式,如

;④公共的class類名,比如content、conttent_title等,只做公共布局用;

4css規範

①省略0後面的單位,例如:margin-right: 0;

②最佳實踐,我們應該遵循以下順序(應該按照下表的順序,不做強求):

結構性屬性:

display

position, left, top, right etc.

overflow, float, clear etc.

margin, padding

表現性屬性:

5、使用嚴格等於(===)判斷

區別說明:

①==, 兩邊值型別不同的時候,要先進行型別轉換,再比較。

②===,不做型別轉換,型別不同的一定不等。

* 分塊定義非同步元件 使用 amd 風格的 require

* const home = resolve => require(['./home.vue'], resolve)

*/6.路由

乙個頁面對應乙個資料夾,對應元件放在對應頁面資料夾裡面,路由名盡量簡潔,語義化,

檔名對應路由名,對應vuex模組名

7.請求檔案

字尾必須為駝峰api

8.vuex檔案結構規範

模組化: 

機構化:

//覺得ok,右下角頂一下,謝謝

編碼規範參考

我本人不太推薦制定過細的編碼規範。制定編碼規範是為了增強 的可讀性,畢竟 的結構才是主要關注問題,所以我的編碼規範還是比較簡短的。裡面只是對可能會破壞編碼風格的行為進行約束,而沒有細化到 空行 甚至 空格 的級別。一 命名空間 公司名稱 產品名稱 相關技術 用途 子命名空間 二 風格 三 命名規範 ...

C 規範 自己參考

01.檔名稱 myclass.h 02.摘 要 03.04.當前版本 05.作 者 06.完成日期 07.08.更新說明 09.10.11.12.ifndef myclass h 13.define myclass h 14.15.include 標準庫標頭檔案 16.17.include othe...

規範 前端編碼規範 注釋規範

頂部新增檔案申明資訊,包括檔案描述 原始作者,如果有更新,則需要新增更新內容 更新作者和更新時間。description 說明文字 author 張三 description 說明文字 author 張三 update 更新內容 by 李四 2013 04 13 18 32 無論是單行注釋還是多行注...