Javascript规范
1 变量命名
1.1 [规范] 变量和函数名称,采用驼峰命名方式,即第一个单词以小写字母开始,从第二个单词开始以后的每个单词首字母采用大写字母
// good
var dashboarPage = {};
var camelCase = ‘命名规则’;
// bad
var dashboardpage = {};
var DashboardPage = {};
var dashboard_page = {};
1.2 [规范] 变量或方法名称,禁止以下划线结束
// good
var personName = ‘Jone’;
// bad
var personName_ = ‘Jone’;
1.3 [规范] 禁止使用拼音方式命名
// good
var warningContent = ‘用户名不能为空!’;
// bad
var gaojingneirong = ‘用户名不能为空!’;
1.4 [建议] 字符串使用单引号 '
// good
var name = 'peter';
// bad
var name = "peter";
2 代码风格
2.1 [规范] 使用4个空格作为一个缩进层级;不允许使用2个空格或tab字符
// good
if (0 < num) {
return true;
}
// bad
if (0 < num) {
return true; // 缩进2个空格
}
// bad
if (0 < num) {
return true; // 使用tab键盘缩进
}
2.2 [规范] 二元运算符两侧必须有一个空格
// good
var sum = 1 + 2;
if (personName === ‘Jone’) {
runA ();
}
// bad
var sum=1+2;
if (personName===’Jone’) {
runA ();
}
2.3 [规范] if / else / for / while / function / switch / do / try / catch / finally 关键字后,必须有一个空格。
// good
if (condition) {
}
while (condition) {
}
(function () {
})();
// bad
if(condition) {
}
while(condition) {
}
(function() {
})();
2.4 [规范] if,while等条件判断语句中,不能省略大括号
// goog
if (1 === a) {
return true;
}
// bad
If (1 === a) return true;
2.5 [规范] 用作代码块起始的左花括号 { 前必须有一个空格,右大括号 { 必须单独一行
// good
if (condition) {
}
while (condition) {
}
(function () {
})();
// bad
if(condition) {
}
while(condition) {
}
(function() {
})();
2.6 [规范] 在对象创建时,属性中的 : 之后必须有空格,: 之前不允许有空格
// good
var obj = {
a: 1,
b: 2,
c: 3
};
// bad
var obj = {
a : 1,
b:2,
c :3
};
2.7 [规范] 函数声明、具名函数表达式、函数调用中,函数名和 ( 之间不允许有空格
// good
function funcName() {
}
var funcName = function funcName() {
};
funcName();
// bad
function funcName () {
}
var funcName = function funcName () {
};
funcName ();
2.8 [规范] 逗号“,”和分号“;”前不允许有空格
// good
callFunc(a, b);
// bad
callFunc(a , b) ;
2.9 [规范] 行尾不得有多余的空格
2.10 [规范] 每行不得超过120个字符;超长的不可分割的代码允许例外,比如复杂的正则表达式,长字符串不在例外之列
2.11 [建议] 在语句的行长度超过 120 时,根据逻辑条件合理缩进
// good
if (user.isAuthenticated()
&& user.isInRole('admin')
&& user.hasAuthority('add-admin')
|| user.hasAuthority('delete-admin')
) {
// Code
}
var html = '' // 此处用一个空字符串,以便整个HTML片段都在新行严格对齐
+ '<article>'
+ '<h1>Title here</h1>'
+ '<p>This is a paragraph</p>'
+ '<footer>Complete</footer>'
+ '</article>';
var html = [
'<article>',
'<h1>Title here</h1>',
'<p>This is a paragraph</p>',
'<footer>Complete</footer>',
'</article>'
];
html = html.join('');
foo(
aVeryVeryLongArgument,
anotherVeryLongArgument,
callback
);
// 链式调用较长时采用缩进进行调整。
$('#items')
.find('.selected')
.highlight()
.end();
3 语言特性
3.1 [规范] 每个 var 只能声明一个变量
// good
var hangModules = [];
var missModules = [];
var visited = {};
// bad
var hangModules = [],
missModules = [],
visited = {};
3.2 [建议] 变量必须即用即声明,不得在函数或其它形式的代码块起始位置统一声明所有变量。
解释:变量声明与使用的距离越远,出现的跨度越大,代码的阅读与维护成本越高。虽然JavaScript的变量是函数作用域,还是应该根据编程中的意图,缩小变量出现的距离空间。
3.3 [规范] 比较相等时,用严格等号===替代==
// good
if (age === 30) {
// ......
}
// bad
if (age == 30) {
// ......
}
4 ES6规范
4.1 [规范] const定义的变量,必须大写,用下划线间隔开来
4.2 [建议] 使用拓展运算符 ... 复制数组
4.3 [建议] 对数组使用解构赋值。
//good
const [first, second] = arr;
// bad
const first = arr[0];
const second = arr[1];
4.4 [建议] 使用模板字符串替代字符串连接
// good
function sayHi(name){
return `How are you ${name}?`
}
// bad
function sayHi(name){
return 'How are you, ' + name + '?';
}
5 注释规范
5.1 [建议]文件注释应位于文件的最前面,包含概要说明、版本、版权声明、修改时间;文件注释必须全部以英文字符表示
/*!
* iODS v3 (http://www.hollysys.com/)
* Hollysys 2019-2020
* srx 2019.9.18
*/
5.2 [规范]单行注释,以//开始,后面留一个空格
// good
// this is a comment
5.3 [建议]多行注释,从第二行起,每行以“空格+”开始,使对齐
/*
* this is a commen
* @param {Array} nodeName 节点名称
*/
5.4 [建议]不要将注释内容写在注释的开始符和结束符所在行
// bad
/* start
end */
5.5 [建议]用@method声明函数或类方法;函数有参数时,必须使用@param,当函数有返回值时,必须使用@return
/*
* 返回当前集合中指定位置的元素
* @method/@class
* @param {Number} [i=0] 位置下标。如果为负数,则从集合的最后一个元素开始倒数
* @return {Element} 指定元素
*/
5.6 [建议] 必须使用 @event 标识事件,事件参数的标识与方法描述的参数标识相同
/**
* 值变更时触发
*
* @event Select#change
* @param {Object} e e描述
* @param {string} e.before before描述
* @param {string} e.after after描述
*/
[if !supportLists]1 [endif]变量命名
[if !supportLists]1.1 [endif][规范] 变量和函数名称,采用驼峰命名方式,即第一个单词以小写字母开始,从第二个单词开始以后的每个单词首字母采用大写字母
// good
var dashboarPage= {};
var camelCase
= ‘命名规则’;
// bad
var dashboardpage= {};
var DashboardPage= {};
var dashboard_page= {};
1.2 [endif][规范] 变量或方法名称,禁止以下划线结束
// good
varpersonName = ‘Jone’;
// bad
varpersonName_ = ‘Jone’;
1.3 [endif][规范] 禁止使用拼音方式命名
// good
var
warningContent = ‘用户名不能为空!’;
// bad
var
gaojingneirong = ‘用户名不能为空!’;
1.4 [endif][建议] 字符串使用单引号'
// good
var name= 'peter';
// bad
var name= "peter";
2 代码风格
2.1 [规范] 使用4个空格作为一个缩进层级;不允许使用2个空格或tab字符
// good
if (0< num) {
return true;
}
// bad
if (0< num) {
returntrue; //缩进2个空格
}
// bad
if (0< num) {
return true; //使用tab键盘缩进
}
2.2 [endif][规范] 二元运算符两侧必须有一个空格
// good
var sum =1 + 2;
if (personName=== ‘Jone’) {
runA();
}
// bad
varsum=1+2;
if(personName===’Jone’) {
runA();
}
2.3 [规范] if / else/ for / while / function / switch / do / try / catch / finally 关键字后,必须有一个空格。
// good
if(condition) {
}
while(condition) {
}
(function() {
})();
// bad
if(condition){
}
while(condition){
}
(function(){
})();
2.4 [规范] if,while等条件判断语句中,不能省略大括号
// goog
if (1 ===a) {
return true;
}
// bad
If (1 ===a) return true;
2.5 [endif][规范] 用作代码块起始的左花括号 { 前必须有一个空格,右大括号{ 必须单独一行
// good
if(condition) {
}
while(condition) {
}
(function() {
})();
// bad
if(condition){
}
while(condition){
}
(function(){
})();
2.6 [endif][规范] 在对象创建时,属性中的 : 之后必须有空格,: 之前不允许有空格
// good
var obj ={
a: 1,
b: 2,
c: 3
};
// bad
var obj ={
a : 1,
b:2,
c :3
};
2.7 [endif][规范] 函数声明、具名函数表达式、函数调用中,函数名和 ( 之间不允许有空格
// good
functionfuncName() {
}
varfuncName = function funcName() {
};
funcName();
// bad
functionfuncName () {
}
varfuncName = function funcName () {
};
funcName();
2.8 [endif][规范] 逗号“,”和分号“;”前不允许有空格
// good
callFunc(a,b);
// bad
callFunc(a, b) ;
2.9 [endif][规范] 行尾不得有多余的空格
[if !supportLists]2.10 [endif][规范] 每行不得超过120个字符;超长的不可分割的代码允许例外,比如复杂的正则表达式,长字符串不在例外之列
[if !supportLists]2.11 [endif][建议] 在语句的行长度超过 120 时,根据逻辑条件合理缩进
// good
if(user.isAuthenticated()
&& user.isInRole('admin')
&& user.hasAuthority('add-admin')
|| user.hasAuthority('delete-admin')
) {
// Code
}
var html
= '' // 此处用一个空字符串,以便整个HTML片段都在新行严格对齐
+ ''
+ '
Title here
'
+ '
This is a paragraph
'
+ 'Complete'
+ '';
var html= [
'',
'
Title here
',
'
This is aparagraph
',
'Complete',
''
];
html =html.join('');
foo(
aVeryVeryLongArgument,
anotherVeryLongArgument,
callback
);
// 链式调用较长时采用缩进进行调整。
$('#items')
.find('.selected')
.highlight()
.end();
3 [endif]语言特性
3.1 [endif][规范] 每个 var 只能声明一个变量
// good
varhangModules = [];
varmissModules = [];
varvisited = {};
// bad
varhangModules = [],
missModules = [],
visited ={};
3.2 [endif][建议] 变量必须即用即声明,不得在函数或其它形式的代码块起始位置统一声明所有变量。
解释:变量声明与使用的距离越远,出现的跨度越大,代码的阅读与维护成本越高。虽然JavaScript的变量是函数作用域,还是应该根据编程中的意图,缩小变量出现的距离空间。
3.3 [endif][规范] 比较相等时,用严格等号===替代==
// good
if (age=== 30) {
// ......
}
// bad
if (age== 30) {
// ......
}
4 [endif]ES6规范
4.1 [endif][规范] const定义的变量,必须大写,用下划线间隔开来
4.2 [endif][建议] 使用拓展运算符 ... 复制数组
4.3 [endif][建议] 对数组使用解构赋值。
//good
const[first, second] = arr;
// bad
constfirst = arr[0];
constsecond = arr[1];
4.4 [endif] [建议] 使用模板字符串替代字符串连接
// good
functionsayHi(name){
return `How are you ${name}?`
}
// bad
functionsayHi(name){
return 'How are you, ' + name + '?';
}
5 [endif]注释规范
5.1 [endif][建议]文件注释应位于文件的最前面,包含概要说明、版本、版权声明、修改时间;文件注释必须全部以英文字符表示
/*!
* iODS v3 (http://www.hollysys.com/)
* Hollysys 2019-2020
* srx 2019.9.18
*/
5.2 [endif][规范]单行注释,以//开始,后面留一个空格
// good
// thisis a comment
5.3 [endif][建议]多行注释,从第二行起,每行以“空格+”开始,使对齐
/*
* this is a commen
* @param {Array} nodeName节点名称
*/
5.4 [endif][建议]不要将注释内容写在注释的开始符和结束符所在行
// bad
/* start
end */
5.5 [endif][建议]用@method声明函数或类方法;函数有参数时,必须使用@param,当函数有返回值时,必须使用@return
/*
*返回当前集合中指定位置的元素
* @method/@class
* @param {Number} [i=0]位置下标。如果为负数,则从集合的最后一个元素开始倒数
* @return {Element}指定元素
*/
5.6 [endif] [建议] 必须使用 @event 标识事件,事件参数的标识与方法描述的参数标识相同
/**
*值变更时触发
*
* @event Select#change
* @param {Object} e e描述
* @param {string} e.before before描述
* @param {string} e.after after描述
*/