代码规范
javascript格式规范
使用标准
ECMAScript 6
使用 ECMAScript 6 作为源码标准。
缩进
|
1
2
3
|
[ 1, 2, 3, 4, 5 ].map( ( value, index, array ) => {
return
value + index;
} );
|
变量
|
1
2
3
4
5
6
7
8
9
|
// Good.
const PI = 3.141592653;
const TEAM_NAME =
'Front-end'
;
let followingProjects = [
'EPM UI'
,
'EPM UI Docs'
,
'and more'
];
// Bad.
const Pi = 3.141592653;
const teamname =
'Front-end'
;
let p = [
'EPM UI'
,
'EPM UI Docs'
,
'and more'
];
|
数组
|
1
2
3
4
5
6
|
let array1 = [ 1, 2, 3, 4 ];
let array2 = [
'Hello'
,
'World!'
];
|
对象
|
1
2
3
4
5
6
7
|
let obj1 = { key1:
'value1'
, key2:
'value2'
, key3:
'value3'
};
let obj2 = {
key1:
'value1'
,
key2:
'value2'
,
key3:
'value3'
};
|
字符串
|
1
2
3
4
5
|
let str =
'I am string.'
;
if
( str ===
"I'm string."
) {
console.log( 'Great !' );
}
|
函数
function
sum( a, b, c ) {
return
a + b + c;
}
if
(
true
) {
console.log( sum( 1, 2, 3 ) );
}
|
代码块
|
1
2
3
4
5
6
7
|
for
( let i = 0; i < 100; i++ ) {
// Do something cool here, such as save file for 100 times to ensure it has been saved successfully.
}
if
(
true
) {
console.log(
"You're fxxking genius!"
);
}
|
表达式
|
1
2
3
4
5
6
7
8
9
|
// Good.
if
( 0 ==
false
&& ( 1 ==
true
||
''
===
false
) ) {
let result = ( a / b ) % 10;
}
// Bad.
if
( 0==
false
&&( 1==
true
||
''
===
false
) ) {
let result=( a/b )%10;
}
|
语句
|
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
32
33
34
35
36
37
38
39
40
41
|
// Good.
if
(
true
) {
while
(
false
) {
// Just an example here.
}
switch
( someValue ) {
case
'foo'
:
console.log(
'bar'
);
break
;
case
'bar'
:
console.log(
'foo'
);
break
;
default
:
console.log(
"What's that."
);
}
for
( let i = 0; i < 100; i ++ ) {
// Just an example here.
}
}
// Bad.
if
(
true
){
while
(
false
){
// Just an example here.
}
switch
( someValue ){
case
'foo
':
console.log( '
bar
' );
break;
case '
bar
':
console.log( '
foo
' );
break;
default:
console.log( "What'
s that." );
}
for
( let i = 0; i < 100; i ++ ){
// Just an example here.
}
}
|
注释
|
1
2
3
4
5
|
for
( let i = 0; i < 100; i++ ) {
// This is a comment.
console.log(
'Print something.'
);
// 这又是一个注释。
// 中文与 English 相结合的注释，带数字 300166 的例子。
}
|
基本结构示例
|
1
2
3
4
5
6
7
8
9
10
11
12
13
|
import FooClass from
'foo'
;
import { coolUtil } from
'utilities'
;
class CoolClass extends FooClass {
constructor( ...args ) {
super
( ...args );
}
}
export { CoolClass };
export
default
CoolClass;
|
jsx规范
|
1
2
3
4
5
6
7
|
<
Table
dataSource
=
"ajax/table"
>
<
Column
title
=
"姓名"
dataIndex
=
"name"
>
{ ( value ) => <
a
>{ value }</
a
> }
</
Column
>
<
Column
title
=
"年龄"
dataIndex
=
"age"
/>
<
Column
title
=
"地址"
dataIndex
=
"address"
/>
</
Table
>
|