前端常见命名

375 阅读2分钟

常见单词

  • 前缀
//(基本类型放前面)动词为主
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