赏心悦目的代码排版风格不仅有助于团队合作，而且能有效提高个人复盘阅读代码的效率。
一、缩进 Indentation
神奇的缩进是他们设计师的最爱，据说最优秀的排版设计师只须会空格就足矣，哈哈。
function make_abs_adder(x) {
function the_adder(y) {
if (x >= 0) {
return x + y;
} else {
return -x + y;
}
}
return the_adder;
}
单行过长也用 indentation 分割。
function frac_sum(a, b) {
return (a > b) ? 0
: 1 / (a * (a + 2))
+
frac_sum(a + 4, b);
}
二、行长 Line Length
按照编程惯例，不要超过80个字符太多。
三、花括号 Curly Braces
花括号的开端应该置于同一行的行尾，重新开一行收尾。
// function declaration
function my_function() {
}
// if-else
if () {
...
} else if () {
...
} else {
...
}
// nested-if
if () {
...
if () {
... }
...
}
始终都要应用 Curly-Braces，即使在单行里面：
// correct Source
if () {
return x + y;
} else {
return x y;
}
// incorrect Source
if ()
return x + y;
else
return x y;
// worse
if () return x + y;
else return x * y;
四、空格 Whitespace
运算符与运算数之间要留出来一个空格。
// good style
const x = 1 + 1;
// bad style
const x=1+1;
// good style
return x === 0 ? "zero" : "not zero";
// bad style
return x === 0?"zero":"not zero";
Do not leave a space between unary operators and the variable involved.
// good style
const negative_x = -x;
// bad style
const negative_x = -x;
五、函数定义表达式 Function Definition Expressions
函数的格式是颇有技术含量的部分，个人的审美不同，常常呈现多种风格，尤其是对多arguments的刻意对齐：
// good style
function count_buttons(garment) {
return accumulate((sleaves, total) => sleaves + total,
0,
map(jacket =>
is_checkered(jacket) ? count_buttons(jacket)
: 1,
garment));
}
// good style
function count_buttons(garment) {
return accumulate(
(sleaves, total) =>
delicate_calculation(sleaves + total),
0,
map(jacket =>
is_checkered(jacket)
? count_buttons(jacket)
: 1,
garment));
}
// bad style: too much indentation
function count_buttons(garment) {
return accumulate((sleaves, total) =>
delicate_calculation(sleaves + total),
0,
map(jacket =>
is_checkered(jacket)
? count_buttons(jacket)
: 1,
garment));
}
// no newline allowed between parameters and =>
function count_buttons(garment) {
return accumulate(
(sleaves, total)
=> delicate_calculation(sleaves + total),
0,
map(jacket
=> is_checkered(jacket)
? count_buttons(jacket)
: 1,
garment));
}
六、条件判断表达式 Conditional Expressions
简单的ternary-condition不要罗嗦写成多行：
// good style
const aspect_ratio = landscape ? 4 / 3 : 3 / 4;
// bad style
const aspect_ratio = landscape
? 4 / 3
: 3 / 4;
多行则用indentation，同样地，也不必追求美观而过分对齐。
// good style
function A(x,y) {
return y === 0 ? 0
: x === 0 ? 2 y
: y === 1 ? 2
: A(x - 1, A(x, y - 1));
// bad style: line too long
function A(x,y) {
return y === 0 ? 0 : x === 0 ? 2 y : y === 1 ? 2 : A(x -1, A(x, y -1));
}
// bad style: too much indentation
function A(x,y) {
return y === 0
? 0
: x === 0
? 2 * y
: y === 1
? 2
: A(x -1, A(x, y -1));
}
七、条件语句与函数
此处的惯例简单，在 if 与 开阔号之间留一个空格。
if () {
...
} else if () {
...
} else {
...
}
函数有多个arguments，则在每个之后留出一个空格：
// good style
function my_function(arg1, arg2, arg3) {
...
}
// bad style
function my_function (arg1, arg2, arg3) {
...
}
// good style
my_function(1, 2, 3);
// bad style
my_function(1,2,3);
// bad style
my_function (1, 2, 3);
There should be no spaces after your opening parenthesis and before your closing parenthesis.
// bad style
function my_function( arg1, arg2, arg3 ) {
...
}
// bad style
my_function( 1, 2, 3 );
// bad style
if ( x === 1 ) {
...
}
// good style
function my_function(arg1, arg2, arg3) {
...
}
// good style
my_function(1, 2, 3);
// good style
if (x === 1) {
...
}
//代码效果参考：http://www.zidongmutanji.com/bxxx/59100.html
提交代码前，务必记得将尾部的trailling-whitespace全部清除掉。
八、命名 Names
命名的风格推荐：
my_variable, x, rcross_bb
函数命名须注意的是，不要在nested-scope中使用相同的命名，常常会误触发shadow。
// bad program
const x = 1; function f(x) {
// here, the name x declared using const
// is "shadowed" the formal parameter x
...
}
// another bad program
function f(x) {
return x => ...;
// here, the formal parameter x of f is "shadowed"
// by the formal parameter of the returned function
}
// a third bad program
function f(x) {
const x = 1;
// in the following, the formal parameter x of f // is "shadowed" by the const declaration of x.
...
}
最后祭出一个极端的个例，两个参数取名相同。
// worse than the above
function f(x, x) {
...
}
九、注释 Comments
避免过多的罗嗦注释。
// area of rectangle with sides x and y
function area(x, y) {
return x * y;
}
下面则是罗嗦的注释：
// square computes the square of the argument x
function square(x) {
return x x;
}
单行注释用"//", 多行注释则用”/...*/".
