JavaScript代码基础规范

本文参考自：https://github.com/fex-team/styleguide/blob/master/javascript.md

1 结构

1.1 缩进

[强制] 使用 4 个空格做为一个缩进层级，不允许使用 2 个空格 或 tab 字符。

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

示例：

// 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 空格

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

var a = !arr.length;
a++;
a = b + c;

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

// good
if (condition) {
}

while (condition) {
}

function funcName() {
}

// bad
if (condition){
}

while (condition){
}

function funcName(){
}

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

// good
if (condition) {
}

while (condition) {
}

(function () {
})();

// bad
if(condition) {
}

while(condition) {
}

(function() {
})();

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

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

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

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

// good
function funcName() {
}

var funcName = function funcName() {
};

funcName();

// bad
function funcName () {
}

var funcName = function funcName () {
};

funcName ();

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

// good
callFunc(a, b);

// bad
callFunc(a , b) ;

[强制] 在函数调用、函数声明、括号表达式、属性访问、if / for / while / switch / catch 等语句中，() 和 [] 内紧贴括号部分不允许有空格。

// good

callFunc(param1, param2, param3);

save(this.list[this.indexes[i]]);

needIncream && (variable += increament);

if (num > list.length) {
}

while (len--) {
}

// bad

callFunc( param1, param2, param3 );

save( this.list[ this.indexes[ i ] ] );

needIncreament && ( variable += increament );

if ( num > list.length ) {
}

while ( len-- ) {
}

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

// 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 个字符。

解释：

超长的不可分割的代码允许例外，比如复杂的正则表达式。长字符串不在例外之列。

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

// 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;

[建议] 不同行为或逻辑的语句集，使用空行隔开，更易阅读。

// 仅为按逻辑换行的示例，不代表setStyle的最优实现
function setStyle(element, property, value) {
if (element == null) {
return;
}

element.style[property] = value;
}

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

if (condition) {
// some statements;
}
else {
// some statements;
}

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

语句

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

// good
if (condition) {
callFunc();
}

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

[强制] 函数定义结束不允许添加分号。

// good
function funcName() {
}

// bad
function funcName() {
};

// 如果是函数表达式，分号是不允许省略的。
var funcName = function () {
};

1.4 命名

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

var loadingModules = {};

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

var HTML_ENTITY = {};

[强制] 函数 使用 Camel命名法。

function stringFormat(source) {
}

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

function hear(theBells) {
}

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

function TextNode(options) {
}

[强制] 类的 方法 / 属性 使用 Camel命名法。

function TextNode(value, engine) {
this.value = value;
this.engine = engine;
}

TextNode.prototype.clone = function () {
return this;
};

[强制] 类名 使用 名词。

function Engine(options) {
}

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

function getStyle(element) {
}

[建议] boolean 类型的变量使用 is 或 has 开头。

var isReady = false;
var hasMoreCommands = false;