js命名规范

js命名应遵循 简洁、语义化 的原则
一、变量
命名方法: 小驼峰式命名法
命名规范:前缀为形容词 (函数前缀为动词, 以此来区分函数和变量)

# 好的命名方式 let maxCount = 10; let tableTitle = '啦啦啦'; # 不好的命名方式 let setConut = 10; let getTitle = '啦啦啦';

二、常量
命名方法:名词全部大写
命名规范:使用大写字母和下划线来组合命名,下划线用来分割单词。
const MAX_COUNT = 10; const URL = '//www.huifenqi.com';

三、函数 & 方法
命名方法: 小驼峰式命名法
命名规范: 前缀应该为动词
命名建议:常用动词约定
动词 含义
can 判断是否可执行某个动作
has 判断是否含义某个值
is 判断是否为某个值
get 获取某个值
set 设置某个值
load 加载某些数据
// 是否可阅读 function canRead() {} // 获取名称 function getName() {}

四、类 & 构造函数
命名方法:大写驼峰式命名法,首字母大写。
命名规范:前缀为名称。
class Persion { constructor(name) { ... } }let person = new Person('啦啦啦');

五、类的成员
【js命名规范】类的成员包括:
  1. 公共属性和方法: 跟变量和函数命名一样。
  2. 私有属性和方法:前缀为下划线_, 后面跟公共属性和方法一样的命名方式。
class Person { // 私有属性 _name: string; constructor() { }// 公共方法 getName() { return this._name; } // 公共方法 setName(name) { this._name = name; } }

六、注释规范
格式化插件推荐prettier
6.1 单行注释
// 设置标题 setTitle()

6.2 多行注释
/* * 代码执行到这里后会调用setTitle()函数 * setTitle():设置title的值 */ setTitle();

6.3 函数 & 方法注释
/** * 函数说明 * @关键字 **/

常用关键字注释
注释名 语法 含义 示例
@param @param {参数类型} 描述信息 描述参数 @param {String} name 传入名称
@return @return {参数类型} 描述信息 描述返回值 @retun {Boolean} true: 可执行; false: 不可执行
@author @author 描述信息 描述作者 @author 某某某 2018/04/24
@example @example 示例代码 演示函数的使用 @example setTitle('啦啦啦');
七、vue常用开发规范
  • 参考vue风格指南
7.1 import
import 应置于顶层, 引入组件名遵循大写驼峰式命名法。
import ElInput form '***' import Emitter from '***'

7.2 methods
命名方法:同函数命名法
命名建议:事件处理应以handle开头,如handleBlur
其他建议:使用promiseasync/await处理异步逻辑,避免使用回调函数。
7.3 少使用watch, 直接监听事件。
7.4 合理利用style的scope属性,隔离页面样式。通用组件应避免使用scope.

    推荐阅读