吃不胖的茶叶蛋

JavaScript编码规范

• 分类: JavaScript • 标签: JavaScript

1 结构

1.1 缩进

[强制]使用4个空格作为一个缩进层级

[强制] switch 下的 case 和 default 必须增加一个缩进层级。
示例：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
// good
switch (variable) {

    case '1':
        // do...
        break;

    case '2':
        // do...
        break;

    default:
        // do...

}

// bad
switch (variable) {

case '1':
    // do...
    break;

case '2':
    // do...
    break;

default:
    // do...

}

1.2 空格

[强制] 二元运算符两侧必须有一个空格，一元运算符与操作对象之间不允许有空格

1
2
3
var a = !arr.length;
a++;
a = b + c;

[强制] 用作代码块起始的左花括号 { 前必须有一个空格。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
// good
if (condition) {
}

while (condition) {
}

function funcName() {
}

// bad
if (condition){
}

while (condition){
}

[强制] if / else / for / while / function / switch / do / try / catch / finally 关键字后，必须有一个空格。

1
2
3
4
5
6
7
8
9
// good
if (condition) {
}

while (condition) {
}

(function () {
})();

[强制] 在对象创建时，属性中的 : 之后必须有空格，: 之前不允许有空格。

1
2
3
4
5
6
7
8
9
10
11
12
13
// good
var obj = {
    a: 1,
    b: 2,
    c: 3
};

// bad
var obj = {
    a : 1,
    b:2,
    c :3
};

[强制] 函数声明、具名函数表达式、函数调用中，函数名和 ( 之间不允许有空格。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
// good
function funcName() {
}

var funcName = function funcName() {
};

funcName();

// bad
function funcName () {
}

var funcName = function funcName () {
};

[强制] , 和 ; 前不允许有空格。

1
2
3
4
5
// good
callFunc(a, b);

// bad
callFunc(a , b) ;

[强制] 单行声明的数组与对象，如果包含元素，{} 和 [] 内紧贴括号部分不允许包含空格。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
// good
var arr1 = [];
var arr2 = [1, 2, 3];
var obj1 = {};
var obj2 = {name: 'obj'};
var obj3 = {
    name: 'obj',
    age: 20,
    sex: 1
};

// bad
var arr1 = [ ];
var arr2 = [ 1, 2, 3 ];
var obj1 = { };
var obj2 = { name: 'obj' };
var obj3 = {name: 'obj', age: 20, sex: 1};

1.3 换行

[强制] 每行不得超过 120 个字符。

[强制] 运算符处换行时，运算符必须在新行的行首。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
// good
if (user.isAuthenticated()
    && user.isInRole('admin')
    && user.hasAuthority('add-admin')
    || user.hasAuthority('delete-admin')
) {
    // Code
}

var result = number1 + number2 + number3
    + number4 + number5;


// bad
if (user.isAuthenticated() &&
    user.isInRole('admin') &&
    user.hasAuthority('add-admin') ||
    user.hasAuthority('delete-admin')) {
    // Code
}

var result = number1 + number2 + number3 +
    number4 + number5;

[建议] 对于 if…else…、try…catch…finally 等语句，推荐使用在 } 号后添加一个换行 的风格，使代码层次结构更清晰，阅读性更好。

1
2
3
4
5
6
7
8
9
10
11
12
13
if (condition) {
    // some statements;
}
else {
    // some statements;
}

try {
    // some statements;
}
catch (ex) {
    // some statements;
}

1.4 语句

[强制] 不得省略语句结束的分号。

[强制] 在 if / else / for / do / while 语句中，即使只有一行，也不得省略块 {…}。

1
2
3
4
5
6
7
8
9
// good
if (condition) {
    callFunc();
}

// bad
if (condition) callFunc();
if (condition)
    callFunc();

2 命名

[强制] 变量 使用 Camel命名法。

1
var loadingModules = {};

[强制] 常量 使用 全部字母大写，单词间下划线分隔 的命名方式。

1
var HTML_ENTITY = {};

[强制] 函数以及函数的参数 使用 Camel命名法。

1
2
function stringFormat(theBells) {
}

[强制] 类 使用 Pascal命名法。

1
2
function TextNode(options) {
}

[强制] 由多个单词组成的缩写词，在命名中，根据当前命名法和出现的位置，所有字母的大小写与首字母的大小写保持一致。

1
2
3
4
5
6
7
function XMLParser() {
}

function insertHTML(element, html) {
}

var httpRequest = new HTTPRequest();

[强制] 类名 使用 名词。

1
2
function Engine(options) {
}

[建议] 函数名 使用 动宾短语。

1
2
function getStyle(element) {
}

3 注释

3.1 单行注释:

[强制] 必须独占一行。// 后跟一个空格，缩进与下一行被注释说明的代码一致。

3.2 多行注释:

[建议] 避免使用 /…/ 这样的多行注释。有多行注释内容时，使用多个单行注释。

3.3 函数/方法注释

[强制] 函数/方法注释必须包含函数说明，有参数和返回值时必须使用注释标识。

[强制] 参数和返回值注释必须包含类型信息和说明。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
/**
 * 函数描述
 *
 * @param {string} p1 参数1的说明
 * @param {string} p2 参数2的说明，比较长
 *     那就换行了.
 * @param {number=} p3 参数3的说明（可选）
 * @return {Object} 返回值描述
 */
function foo(p1, p2, p3) {
    var p3 = p3 || 10;
    return {
        p1: p1,
        p2: p2,
        p3: p3
    };
}gg

4 语言特性

4.1 条件

[强制] 在 Equality Expression 中使用类型严格的 ===。仅当判断 null 或 undefined 时，允许使用 == null。

解释：

使用 === 可以避免等于判断中隐式的类型转换。

示例：

1
2
3
4
5
6
7
8
9
// good
if (age === 30) {
    // ......
}

// bad
if (age == 30) {
    // ......
}

4.2 类型抓换

[建议] 转换成 string 时，使用 + ‘’。

1
2
3
4
5
6
7
// good
num + '';

// bad
new String(num);
num.toString();
String(num);

[建议] 转换成 number 时，通常使用 +。

1
2
3
4
5
// good
+str;

// bad
Number(str);

[强制] 使用 parseInt 时，必须指定进制。

1
2
3
4
5
// good
parseInt(str, 10);

// bad
parseInt(str);

[建议] 转换成 boolean 时，使用 !!。

1
2
var num = 3.14;
!!num;

4.3 字符串

[强制] 字符串开头和结束使用单引号 ‘。

4.4 数组

[强制] 使用数组字面量 [] 创建新数组，除非想要创建的是指定长度的数组。

1
2
3
4
5
// good
var arr = [];

// bad
var arr = new Array();