前端常見命名

hackLi發表於2019-01-17
前端

常見單詞

  • 字首
//(基本型別放前面)動詞為主
is      //是否
un      //否定
run     //執行
need    //需要
final   // 
default // 預設
reset   //重置
add     //新增
sent    //傳送
stop    //停止
set     //設定
create  // 建立
get //獲取
update  //更新,修改
list    //多個物件
init    //初始化
merge   //合併
use     //使用
bind    //繫結
toggle  //觸發
define  //確定
validate //驗證
shared  //分享
install //載入,安裝
copy    //複製
map/forEach         //遍歷
has/in/is           //有不
save/insert/append  //插入
remove/delete/del   //刪除
複製程式碼
  • 中間
//常見中間單詞
In      //在 (for in 操作)
By      //在
Form    ///來自
To      //到,轉換到
複製程式碼
  • 字尾
//(多個或者集合加一個s) 名詞
Enum    //列舉
Handler //處理者
Handle  //回撥
Length  //長度
Method  //方法
Error   //錯誤
Order   //命令
Name    //名稱
Event   //事件
Target  //目標,當前元素
Type    //多個型別
Utils   //工具
Tree    //樹型
Stack   //堆
Entry   //輸入
Key     //關鍵字
Object  //物件
Match   //匹配
Node/element    //節點
Prop/Attribute  //屬性
Sub/Arr/Array   //組
Val/Value       //值
Count/Index     //計數
Impl/Implement  //工具,手段
Down/Up/Move    //方向操作
複製程式碼
  • 補充
// 補充
case    //容器
alias   //別名
active  //活動的
account //賬戶
lower   //低階的
advanced//高階的
file    //檔案
service //服務
backup  //備份
build   //編譯
call    //呼叫
packages//包
plugin  //外掛
template//模板
cache   //快取
proxy   //代理
computed//計算
next    //下一個
global  //全域性
not     //不
filter  //過濾
empty   //空
child   //子
parent  //父
before  //之前
after   //之後
info    //資訊
msg     //返回資訊
visibility //可見
res/return //返回值
option/config // 相關設定
param/argument //引數
component/module //元件
複製程式碼

規範注意事項

1.根據需要宣告型別
/ ** @type {！Array <number>} * /
const data = [];

2. 檔名不用駝峰式命名
error: bindObjectListeners.js 
use: bind-object-listeners.js

3. || . ? : 使用下一行2個空格
const isAllowed = allowedGlobals(key) ||
        (typeof key === 'string' &&
        key.charAt(0) === '_' && !(key in target.$data))

const appendElement = element.append(element).
        append(element).
        append(element)
                                
const handlers = options.render && options.render._withStripped
        ? getHandler
        : hasHandler

4.希望使用者不用使用的變數加_
this._watcher = null
this._inactive = null
this._directInactive = false
複製程式碼

相關文章