By

文章目录
  1. 1. 1.项目命名
  2. 2. 2. 注释规范
    1. 2.1. 行内注释
    2. 2.2. 命名建议：
    3. 2.3. 单行注释
    4. 2.4. 多行注释
  3. 3. 方法命名
    1. 3.1. 常用动词
    2. 3.2. 参数
  4. 4. 变量命名
  5. 5. css规范
    1. 5.1. 属性书写顺序

1.项目命名

全部采用小写方式， 以下划线分隔。

示例：my_project_name

2. 注释规范

js 支持三种不同类型的注释：行内注释、单行注释和多行注释：

行内注释

说明：行内注释以两个斜线开始，以行尾结束。
语法：code // 这是行内注释
使用方式：//(双斜线)与代码之间保留一个空格，并且//(双斜线)与注释文字之间保留一个空格。

命名建议：

// 用来显示一个解释的评论
// -> 用来显示表达式的结果，
// >用来显示 console 的输出结果，

示例：

1
2
3
4
function test() { // 测试函数
  console.log('Hello World!'); // >Hello World!
  return 3 + 2; // ->5
}

单行注释

说明：单行注释以两个斜线开始，以行尾结束。
语法：// 这是单行注释
使用方式：单独一行 //(双斜线)与注释文字之间保留一个空格。
示例：

1
2
// 调用了一个函数；1)单独在一行
setTitle();

多行注释

说明：以 /* 开头， */ 结尾
语法：/* 注释说明 */
使用方法：至少三行注释时，第一行为/*，最后行为/*，其他行以*开始，并且注释文字与*保留一个空格。
示例:

1
2
3
4
5
/*
* 代码执行到这里后会调用setTitle()函数
* setTitle()：设置title的值
*/
setTitle();

方法命名

命名方式 : 小驼峰方式 ( 构造函数使用大驼峰命名法 )
命名规则 : 前缀为动词(动词+名词为主)

常用动词

• get 获取/set 设置/add 增加/remove 删除/create 创建/destory 移除
• start 启动/stop 停止/open 打开/close 关闭/read 读取/write 写入
• load 载入/save 保存/create 创建/destroy 销毁
• begin 开始/end 结束/backup 备份/restore 恢复/detach 脱离
• import 导入/export 导出/split 分割/merge 合并/inject 注入/extract 提取
• attach 附着/bind 绑定/separate 分离/ view 查看/browse 浏览
• edit 编辑/modify 修改/select 选取/mark 标记/copy 复制/paste 粘贴/undo 撤销
• redo 重做/insert 插入/delete 移除/add 加入/append 添加
• clean 清理/clear 清除/index 索引/sort 排序/find 查找/search 搜索/
• increase 增加/decrease 减少/play 播放/pause 暂停/
• launch 启动/run 运行/pack 打包/unpack 解包/parse 解析/emit 生成
• compile 编译/execute 执行/debug 调试/trace 跟踪
• observe 观察/listen 监听/build 构建/publish 发布/push 推/pull 拉
• input 输入/output 输出/encode 编码/decode 解码
• expand 展开/collapse 折叠/encrypt 加密/decrypt 解密
• compress 压缩/decompress 解压缩
• connect 连接/disconnect 断开/send 发送/receive 接收
• download 下载/upload 上传/refresh 刷新/synchronize 同步
• update 更新/revert 复原/lock 锁定/unlock 解锁
• check out 签出/check in 签入/submit 提交/commit 交付
• begin 起始/end 结束/start 开始/finish 完成/enter 进入/exit 退出
• abort 放弃/quit 离开/obsolete 废弃/depreciate 废旧
• collect 收集/aggregate 聚集

参数

参数前面加$,为了阅读代码时候更直观.

1
2
3
function ($name){
	console.log($name)
}

变量命名

a.骆驼命名法，首字母小写，之后每个单词首字母大写（即首字母小写的驼峰）

b.公开变量，不带下划线，如 userName、currState、loginTime

c.私有变量，前缀下划线，如 _callBackList、_nameHash、_currType
常量，全大写，每个单词之间使用下划线分割，如：TOUCH_COMPLETE、SEND_OVER、RENDER_TYPE_1

d.词性格式，普通的变量以名词为主，布尔类型的变量以形容词/形容词+名词/形容词+动词为主，如：_isOk _canBuild _roleLevel _nameImg

e.其他规则，容易产生误解的变量，考虑加上类型后缀，如：nameTxt、nameStr、avatarId（注意表示id的变量，以Id尾缀会更加清晰)

css规范

属性书写顺序

属性的书写顺序对于浏览器来说没有区别，除了优先级覆盖之外。但是如果顺序保持一致的话，扫一眼可以很快地知道这个选择器有什么类型的属性影响了它，所以一般要把比较重要的属性放前面。比较建议的顺序是这样的：

你可能会觉得我平时差不多就是这么写的，那么说明你有一个比较好的素养。并且我觉得规则不是死，有时候可以灵活，就像你可能会用transform写居中，然后把left/top/transform挨在一起写了，我觉得这也是无可厚非的，因为这样可以让人一眼看出你要干嘛。

命名:
1.不要使用样式特点命名
2.不要用id作为选择器

文章目录
  1. 1. 1.项目命名
  2. 2. 2. 注释规范
    1. 2.1. 行内注释
    2. 2.2. 命名建议：
    3. 2.3. 单行注释
    4. 2.4. 多行注释
  3. 3. 方法命名
    1. 3.1. 常用动词
    2. 3.2. 参数
  4. 4. 变量命名
  5. 5. css规范
    1. 5.1. 属性书写顺序