18. 空白
最后更新于：2022-04-01 21:12:38
* [18.1](https://github.com/yuche/javascript#18.1) 使用 2 个空格作为缩进。
~~~
// bad
function() {
∙∙∙∙const name;
}
// bad
function() {
∙const name;
}
// good
function() {
∙∙const name;
}
~~~
* [18.2](https://github.com/yuche/javascript#18.2) 在花括号前放一个空格。
~~~
// bad
function test(){
console.log('test');
}
// good
function test() {
console.log('test');
}
// bad
dog.set('attr',{
age: '1 year',
breed: 'Bernese Mountain Dog',
});
// good
dog.set('attr', {
age: '1 year',
breed: 'Bernese Mountain Dog',
});
~~~
* [18.3](https://github.com/yuche/javascript#18.3) 在控制语句（`if`、`while` 等）的小括号前放一个空格。在函数调用及声明中，不在函数的参数列表前加空格。
~~~
// bad
if(isJedi) {
fight ();
}
// good
if (isJedi) {
fight();
}
// bad
function fight () {
console.log ('Swooosh!');
}
// good
function fight() {
console.log('Swooosh!');
}
~~~
* [18.4](https://github.com/yuche/javascript#18.4) 使用空格把运算符隔开。
~~~
// bad
const x=y+5;
// good
const x = y + 5;
~~~
* [18.5](https://github.com/yuche/javascript#18.5) 在文件末尾插入一个空行。
~~~
// bad
(function(global) {
// ...stuff...
})(this);
~~~
~~~
// bad
(function(global) {
// ...stuff...
})(this);↵
↵
~~~
~~~
// good
(function(global) {
// ...stuff...
})(this);↵
~~~
* [18.5](https://github.com/yuche/javascript#18.5) 在使用长方法链时进行缩进。使用前面的点 `.` 强调这是方法调用而不是新语句。
~~~
// bad
$('#items').find('.selected').highlight().end().find('.open').updateCount();
// bad
$('#items').
find('.selected').
highlight().
end().
find('.open').
updateCount();
// good
$('#items')
.find('.selected')
.highlight()
.end()
.find('.open')
.updateCount();
// bad
const leds = stage.selectAll('.led').data(data).enter().append('svg:svg').class('led', true)
.attr('width', (radius + margin) * 2).append('svg:g')
.attr('transform', 'translate(' + (radius + margin) + ',' + (radius + margin) + ')')
.call(tron.led);
// good
const leds = stage.selectAll('.led')
.data(data)
.enter().append('svg:svg')
.classed('led', true)
.attr('width', (radius + margin) * 2)
.append('svg:g')
.attr('transform', 'translate(' + (radius + margin) + ',' + (radius + margin) + ')')
.call(tron.led);
~~~
* [18.6](https://github.com/yuche/javascript#18.6) 在块末和新语句前插入空行。
~~~
// bad
if (foo) {
return bar;
}
return baz;
// good
if (foo) {
return bar;
}
return baz;
// bad
const obj = {
foo() {
},
bar() {
},
};
return obj;
// good
const obj = {
foo() {
},
bar() {
},
};
return obj;
~~~
';