【Express.js】代码规范

代码规范

编程规范,对于一个优秀的项目是不可或缺的,有了良好的代码规范,有益于项目的维护与拓展。

命名规范

命名的第一要义是明了,要让阅读者看到命名就能大概猜测出其意义或用处。

以用户身份(userRole)为例,不可过度简略为 "ur",本身这个单词也不算长,拼全 "userRole" 即可,或者 "uRole",因为字母 "u" 通常代表用户,这是约定俗成的。

命名规范可以跟据被命名的目标再细分:

变量命名

可变变量通常用 let 声明,命名时可以采取首字母小写的驼峰(userRole)或者小写蛇形命名法(user_role);常量变量通常用 const 声明,命名时通常采用全大写(USERROLE)或者大写蛇形命名法(USER_ROLE)

函数命名

独立的函数或者作为成员变量的方法,命名通常采取首字母小写的驼峰(checkUserRole)小写蛇形命名法(check_user_role)

类命名

类、接口或者一系列函数和变量的聚合引入的命令通常采用大写驼峰命令法(User),对其内部私有的量或者方法,由于 js 和 ts 都不存在真正意义上的 private,所以在私有量或方法前加上 _ 短下划线即可,意指这是私有的。此外,在声明类或对象拥有的属性和方法时,要避免冗余的前缀,比如:

js 复制代码
class User {
  userLogin() {
  	//...
  }
}

以上代码的 "userLogin" 就是典型的前缀冗余。

文件命名

文件命名通常采用小写驼峰命名(strUtil.js)或者小写点隔式命名(str.util.js),小写蛇形命名法也不是不行,但在 js 项目中较为罕见。

排版规范

一个统一且整洁的排版也是相当重要的,比如:

  1. 统一的 4空格 或者 2 空格缩进,符号后 1 空格缩进
js 复制代码
const sayHi = () => {
  console.log('Hi, Express Learner!');
}
  1. 同行内逗号分隔后的 1空格缩进
  2. 单文件内不同性质或不同阶段的代码用单空行相隔
  3. 引入依赖或其它文件通常写在文件顶部
  4. 函数多参数下放
typescript 复制代码
function add_10_nums(
  a1: number, b1: number,
  a2: number, b2: number,
  a3: number, b2: number,
  a4: number, b2: number,
  a5: number, b2: number)
{
  return //...
}
  1. 多行对齐

等等...

注释规范

合适的注释有助于自己和他人快速理解并维护一段代码,写注释不必事事具细,比如在意义很明显的 login() 函数上加 // 登录函数 这么一句代码,只需要在比较复杂或者仅靠命名和表面的调用关系即可推断出作用的代码上进行适当的注释即可。此外,现在的主流 IDE 对注释都支持 markdown,可以适当地利用 markdown 语法进行注释增强。

切记注释是给人看的,别把注释格式写的难以阅读,比如长篇大论且挤在一行上。

此外通过注释的 JsDoc 可以对函数的参数、返回,对象的属性等进行类型标注和解释,合理的运用 JsDoc 注释,将使得我们在不使用 TypeScript 的情况下也能获得良好的代码提示。


下一节-高性能

相关推荐
Dread_lxy几秒前
vue 依赖注入(Provide、Inject )和混入(mixins)
前端·javascript·vue.js
奔跑草-1 小时前
【前端】深入浅出 - TypeScript 的详细讲解
前端·javascript·react.js·typescript
羡与1 小时前
echarts-gl 3D柱状图配置
前端·javascript·echarts
前端郭德纲1 小时前
浏览器是加载ES6模块的?
javascript·算法
JerryXZR1 小时前
JavaScript核心编程 - 原型链 作用域 与 执行上下文
开发语言·javascript·原型模式
帅帅哥的兜兜1 小时前
CSS:导航栏三角箭头
javascript·css3
杨哥带你写代码2 小时前
网上商城系统:Spring Boot框架的实现
java·spring boot·后端
camellias_2 小时前
SpringBoot(二十一)SpringBoot自定义CURL请求类
java·spring boot·后端
渗透测试老鸟-九青2 小时前
通过投毒Bingbot索引挖掘必应中的存储型XSS
服务器·前端·javascript·安全·web安全·缓存·xss
龙猫蓝图2 小时前
vue el-date-picker 日期选择器禁用失效问题
前端·javascript·vue.js