js代码风格规范

梳理

1. 代码块空格

代码块前要添加空格

if (a) {
  b()
}
function a() {}

2. 单行代码块空格

在单行代码块中使用空格

// 推荐
function foo() { return true; }
if (foo) { bar = 0; }
// 不推荐
function foo() {return true;}
if (foo) {bar = 0;}

3. 函数声明的空格

函数括号前不加空格

function func(x) {
  // ...
}

4. 函数调用的空格

在函数调用时，不使用空格

// 推荐
fn();
// 不推荐
fn ()
fn
()

5. 操作符的空格

操作符前后都需要添加空格

const sum = 1 + 2;

6. 对象字面量的键值空格

• 对象字面量的键和冒号之间不能存在空格
• 对象字面量的冒号和值之间存在一个空格

const obj = { foo: 'haha' };

7. 对象计算属性的空格

在对象的计算属性内，不使用空格

// 推荐
obj[foo]
// 不推荐
obj[foo ]
obj[ foo]
obj[ foo ]

8. 逗号空格

在逗号后面使用空格，逗号前面不加空格

const foo = 1, bar = 2

9. 逗号风格

逗号不出现在行首

// 不推荐
const foo = 1
,
bar = 2;
const foo = 1
, bar = 2;
const foo = ['name'
          , 'age'];

10. 拖尾逗号

• 建议（但不要求）在最后一个元素或属性与闭括号]或}在不同行时，使用拖尾逗号
• 最后一个元素或属性与闭括号] 或 }当在同一行时，禁止使用拖尾逗号

// 不推荐
const foo = { name: 'foo', age: '22', };

11. 拖尾换行

建议文件末保留拖尾换行

function func () {
  // do something
}
  // 此处是新的一行

12. 大括号风格

大括号相对代码位置遵循如下风格（One True Brace Style）：

if (foo) {
    bar()
} else {
    baz()
}

13. 变量命名

• class类/构造函数命名使用大驼峰式命名
• 作为常量使用的变量命名使用全大写
• 一般变量命名使用小驼峰式命名
• 原则上不使用拼音缩写、意义不明的英文缩写命名

14. 缩进

使用空格缩进，缩进量为4空格

15. 链式调用

一行最多有4个链式调用，超过要求换行

16. 空行

最大连续空行数为2

17. 分号

不省略句末的分号

18. 自增自减

不使用自增++和自减--运算符，用+=和-=代替

19. 单行区块

总是用大括号表示区块

// 推荐
if (a) { b(); }
// 不推荐
if (a) b();

20. 减少“魔数”

减少含义不明的数字，尽量使用命名常量代替，在ts中尽量使用enum代替

// 推荐
const STATUS = {
    READY: 0,
    SUCCESS: 1,
    FAILED: 2,
};
if (type === STATUS.READY) {
    // TODO
}
// 不推荐
if (type === 0) {
    // TODO
}