前端代码规范（阿里） --- Javascript

程序员写好看的代码，不亚于写一行好看的字

好看的代码总是让人心旷神怡，

不好，不规范的代码，让人看了想说mmp，

那我们就来学习一下规范的代码怎么写的吧

以下来自B站的学习视频：前端必备-阿里大厂前端开发规范！

五、Javascript规范

(一) 命名

• 采用小写驼峰命名

  lowerCameCase

  ，代码命名均不能以下划线开头，也不能以下划线或美元符号结尾

反例：

_name / name_ / name$

• 方法名、参数名、成员变量、局部变量统一采用驼峰命名风格

正确命名：

localValue / getHttpMessage()

错误命名：

localvalue / gethttpmessage()

• 方法名 必须是 动词 或者 动词+名词 形式
• 增删查改，统一使用如下 5 个单词

add  /  update  /  delete  /  get  /  detail
           

附：函数常用方法的动词：

get 获取       / set 设置
add 增加       / remove 删除
create 创建    / destory 移除
start 启动     / stop 停止
open 打开      / close 关闭
read 读取      / write写入
load 载入      / save 保存
begin 开始     / end 结束
backup 备份    / restore 恢复
import 导入    / export 导出
split 分割     / merge 合并
inject 注入    / extract 提取
           

• 常量全部大写，单词之间用下划线隔开，力求语义表达完整清楚，不要嫌名字长

(二) 代码格式

• 使用两个空格进行缩进

if (x < y) {
	x += 10;
} else {
	x += 1;
}
           

• 不同逻辑，不同语义，不同业务之间插入一个空行分隔

(三) 字符串

统一使用单引号

''

，不使用双引号

""

，这对创建HTML字符串非常有好处

let str = 'foo';
let testDiv = '<div id="test"></div>'
           

(四) 对象声明

• 使用字面量创建对象

推荐：

不推荐：

• 使用字面量来代替对象构建器

推荐：

let user = {
	age: 0
}
           

不推荐：

let user = new Object();
user.age = 0;
           

(五) 优先使用ES6、ES7、ES8的语法

简化程序，使代码更加灵活和可复用

如：箭头函数、await/async、解构、let、for…of 等

(六) 括号

下列关键词必须有大括号（即使代码只有一行）:

if / else / for / while / try / catch / finally / with

推荐：

if (isTrue) {
	doSomeThing();
}
           

不推荐：

(七) undefined判断

永远不要直接使用

undefined

进行变量判断；使用

typeof

和字符串

'undefined'

对变量进行判断

推荐：

if (typeof person === 'undefined') {
	...
}
           

不推荐

if (person === undefined) {
	...
}
           

(八) 条件判断和循环最多三层

条件判断能使用 三目运算符 和 逻辑运算符的，就不要使用条件判断。

如果超过三层的 ，抽成函数，并写清楚注释

(九) this的转换命名

对上下文

this

的引用只能使用

self

来命名

(十) 慎用 console.log

对

console.log

会有性能问题，生产环境下请清除

console.log