|
|
|
# JavaScript代码规范
|
|
|
|
|
|
|
|
## 行的长度
|
|
|
|
每行长度不应该超过**120**个字符，如果一行多余120个字符，应该在一个运算符后换行，下一行增加**2**级缩进，即8个空格）
|
|
|
|
```
|
|
|
|
doSomething(argument1, argument2, argument3, argument4,
|
|
|
|
argument5);
|
|
|
|
```
|
|
|
|
## 运算符间距
|
|
|
|
二元运算符前后必须使用一个空格保持表达式的整洁，操作符包括赋值运算符和逻辑运算符
|
|
|
|
```
|
|
|
|
var name = 'xuqi'; // GOOD
|
|
|
|
var name='xuqi'; // BAD
|
|
|
|
```
|
|
|
|
## 括号间距
|
|
|
|
当使用括号时，紧接左括号之后和紧接右括号之前不应该有空格。
|
|
|
|
```
|
|
|
|
doSomething(arg); // GODD
|
|
|
|
doSomething( arg ); // BAD
|
|
|
|
```
|
|
|
|
## 变量声明
|
|
|
|
* 所有变量在使用前应该先定义
|
|
|
|
* 变量定义应该放在函数开头
|
|
|
|
* 使用var，const，let表达式定义变量，每行定义一个
|
|
|
|
* 除了首行，所有行都应该多一层缩进使变量声明对齐
|
|
|
|
* 初始化的变量放在未初始化的变量之前
|
|
|
|
* 所有的变量命名必须使用英文单词
|
|
|
|
* 浮点变量必须指明实部（即便以0.开头）和小数点后一位
|
|
|
|
|
|
|
|
```
|
|
|
|
var name = 'xuqi',
|
|
|
|
age,
|
|
|
|
sex,
|
|
|
|
...;
|
|
|
|
|
|
|
|
const $ = require('yoho.jquery');
|
|
|
|
|
|
|
|
let i;
|
|
|
|
```
|
|
|
|
|
|
|
|
另外，晦涩的变量名最好给出注释，否则别人很难读懂接下来代码的意思。
|
|
|
|
|
|
|
|
## 函数声明
|
|
|
|
* 函数在使用前应该先定义
|
|
|
|
* 函数名和开始圆括号之间无空格（包括匿名函数的function关键字与圆括号之间）
|
|
|
|
* 开始圆括号和结束圆括号之间无空格
|
|
|
|
* 参数名之间应该在逗号之后保留一个空格
|
|
|
|
* 开始花括号应该同function关键字保持同一行，结束圆括号和开始花括号之间应该保留一个空格
|
|
|
|
* 函数体保持一级缩进
|
|
|
|
|
|
|
|
```
|
|
|
|
function doSomething(arg1, arg2) {
|
|
|
|
doThing1();
|
|
|
|
doThing2();
|
|
|
|
}
|
|
|
|
|
|
|
|
const method = function() {
|
|
|
|
doSomething();
|
|
|
|
};
|
|
|
|
```
|
|
|
|
另外，IIFE的标准格式也在这里指出：
|
|
|
|
```
|
|
|
|
(function(args) {
|
|
|
|
//
|
|
|
|
}(args)); //(args)位于外层括号内
|
|
|
|
```
|
|
|
|
|
|
|
|
## 对象直接量
|
|
|
|
* 起始左括号应该与表达式保持一行
|
|
|
|
* 每个属性的键名前保持一个缩进，第一个属性应该在左括号后另一起行
|
|
|
|
* 每个属性的键名不包含引号，其后跟一个冒号（前无空格，后有空格），然后是值
|
|
|
|
* 如果属性值为函数，函数体应该在属性名之下另起一行，并且其前后均应保留一个空行
|
|
|
|
* 一组相关属性的前后插入空行以提高代码的可读性
|
|
|
|
* 结束的右括号独占一行
|
|
|
|
|
|
|
|
```
|
|
|
|
var person = {
|
|
|
|
name: 'xuqi',
|
|
|
|
age: 25,
|
|
|
|
|
|
|
|
groupAttr1: xx1,
|
|
|
|
groupAttr2: xx2,
|
|
|
|
|
|
|
|
walk: function() {
|
|
|
|
//your walk fn
|
|
|
|
}
|
|
|
|
};
|
|
|
|
```
|
|
|
|
|
|
|
|
* 当对象字面量作为函数参数时，起始括号应该与函数名同行
|
|
|
|
|
|
|
|
```
|
|
|
|
doSomething({
|
|
|
|
//do something
|
|
|
|
});
|
|
|
|
```
|
|
|
|
|
|
|
|
## 命名
|
|
|
|
### 变量：
|
|
|
|
* 采用小驼峰命名格式
|
|
|
|
* 变量命名为名词（区别函数）
|
|
|
|
* 变量中不使用_
|
|
|
|
|
|
|
|
### 函数：
|
|
|
|
* 采用小驼峰命名格式
|
|
|
|
* 函数命名为动词（区别变量）
|
|
|
|
* 函数名中不使用_
|
|
|
|
|
|
|
|
### 构造函数：
|
|
|
|
* 采用大驼峰命名格式
|
|
|
|
* 命名应该是名词
|
|
|
|
|
|
|
|
### 私有成员：
|
|
|
|
* 一个对象中不希望外部访问的以下划线开头（约定）
|
|
|
|
|
|
|
|
## 等号运算符
|
|
|
|
使用`===`和`!==`,禁止使用`==`和`!=`
|
|
|
|
|
|
|
|
## undefined
|
|
|
|
禁止使用`name === undefined`判断一个变量是否定义。应该使用`typeof(name) === 'undefined'`;
|
|
|
|
|
|
|
|
## 常用语句规范
|
|
|
|
### if语句
|
|
|
|
```
|
|
|
|
if (condition) {
|
|
|
|
doSomething();
|
|
|
|
} else if (condition1) {
|
|
|
|
doSomething2();
|
|
|
|
} else {
|
|
|
|
soOtherThing();
|
|
|
|
}
|
|
|
|
```
|
|
|
|
### for语句
|
|
|
|
```
|
|
|
|
// GOOD
|
|
|
|
var i;
|
|
|
|
for (i = 0; i < len; i++) {
|
|
|
|
doSomething();
|
|
|
|
}
|
|
|
|
for (i in collection) {
|
|
|
|
if (collection.hasOwnProperty(i)) {
|
|
|
|
doSomething();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
// BAD
|
|
|
|
for (var i = 0; i < len; i++) {
|
|
|
|
doSomething();
|
|
|
|
}
|
|
|
|
for (i in collection) {
|
|
|
|
doSomething();
|
|
|
|
}
|
|
|
|
```
|
|
|
|
### while,do语句
|
|
|
|
```
|
|
|
|
while (condition) {
|
|
|
|
doSomething();
|
|
|
|
}
|
|
|
|
|
|
|
|
do {
|
|
|
|
doSomething();
|
|
|
|
} while (condition)
|
|
|
|
```
|
|
|
|
|
|
|
|
### switch语句
|
|
|
|
* 每一个case保持一个缩进
|
|
|
|
* 每一组语句都应该以break，return等结尾，或者用一行注释表示跳过(falling through)
|
|
|
|
* 无default的情况也要注释特别说明
|
|
|
|
|
|
|
|
```
|
|
|
|
switch (val) {
|
|
|
|
case 1:
|
|
|
|
//nothing
|
|
|
|
case 2:
|
|
|
|
doSomething();
|
|
|
|
break;
|
|
|
|
default:
|
|
|
|
doDefault();
|
|
|
|
}
|
|
|
|
```
|
|
|
|
|
|
|
|
### try语句
|
|
|
|
```
|
|
|
|
try {
|
|
|
|
doSomething();
|
|
|
|
} catch (err) {
|
|
|
|
doSomething2();
|
|
|
|
} finally {
|
|
|
|
doSomething3();
|
|
|
|
}
|
|
|
|
```
|
|
|
|
|
|
|
|
## 模块化规范
|
|
|
|
* 模块开头require加载所有依赖模块
|
|
|
|
|
|
|
|
```
|
|
|
|
var $ = require('yoho.jquery'),
|
|
|
|
flip = require('../plugin/flip'); //普通文件
|
|
|
|
|
|
|
|
require('../plguin/login');
|
|
|
|
```
|
|
|
|
|
|
|
|
* 模块抛出接口应该给予注释说明功能和使用方法 |
|
|
\ No newline at end of file |
...
|
...
|
|
