stark前端代码规范

1. 缩进

使用两个空格进行缩进。
eslint: indent

function() {
  let a = '测试字符串';
  console.log('测试字符串’);
}

2. 引号

除需要转义的情况或json文件外，字符串统一使用单引号
eslint: quotes

let a = '测试字符串';
console.log('测试字符串');

3. 变量
   3.1 变量/常量声明

   声明变量请使用let
   声明常量或函数表达式请使用const
   禁止使用var

   let a = '测试字符串'; // ✓ ok
   const b = '常量'; // ✓ ok
   var c = 'test'; // ✗ avoid
   

   3.2 变量和函数命名规则

   一律采用驼峰式命名
   eslint: camelcase

   let testName = '测试字符串';
   function openLink() {}
   const jumpToUrl = () => {};
   

   3.3 变量使用规则

   不要定义未使用的变量
   eslint: no-unused-vars

   let a = 'test';
   b = 1; // ✗ avoid
   

   3.4 使用字面量而不是构造器

   eslint: no-array-constructor

   let arr = [1, 2, 3]; // ✓ ok
   let arr = new Array(1, 2, 3); // ✗ avoid
   let obj = {a: 1, b: 2}; // ✓ ok
   let obj = new Object(); // ✗ avoid
   

   3.5 禁止修改const创建的常量

   eslint: no-const-assign

4. 空格规则
   4.1 关键字后面加空格

   eslint: keyword-spacing

   let a = 'test'; // ✓ ok
   if (condition) { ... }   // ✓ ok
   if(condition) { ... }    // ✗ avoid
   function (arguments) {
   　// do something
   }
   

   4.2 函数声明时括号与函数名间加空格

   eslint: space-before-function-paren

   function (arguments) {
   　// do something
   }
   

   4.3 字符串拼接操作符 (Infix operators) 之间要留空格，尽量使用es6模板字符串

   eslint: space-infix-ops

   let a = '我的姓名是' + name;
   let b = `我的姓名是${name}`; // recommend
   

   4.4 类似+-*/=?这类符号两边需要加空格

   let a = 1 + 2 * 3 / 4;
   let b = true ? 1 : 2;
   

   4.5 逗号后面加空格

   eslint: comma-spacing

   let arr = [1, 2, 3, 4];    
   

   4.6 单行代码块两边加空格

   eslint: block-spacing

   function foo () {return true;} // ✗ avoid
   function foo () { return true; } // ✓ ok
   let a = { b: 1 }; // ✓ ok
   let a = {b: 1}; // ✗ avoid
   

5. 等号规则

尽量使用===代替==
eslint: eqeqeq

6. if else语句
   6.1 else 关键字要与花括号保持在同一行

   eslint: brace-style

   // ✓ ok
   if (condition) {
     // ...
   } else {
     // ...
   }
   
   // ✗ avoid
   if (condition)
   {
     // ...
   }
   else
   {
     // ...
   }
   

   6.2 多行 if 语句的的括号不能省

   eslint: curly

   if (options.quiet !== true) console.log('done');  // ✓ ok
   
   if (options.quiet !== true) { // ✓ ok
     console.log('done');
   }
   
   if (options.quiet !== true)  // ✗ avoid
     console.log('done');
   

7. 标点使用规则
   7.1 不允许有多余的行末逗号

   eslint: comma-dangle

   let obj = {
     message: 'hello',   // ✗ avoid
   }
   

   7.2 始终将逗号置于行末

   eslint: comma-style

   var obj = {
     foo: 'foo'
     ,bar: 'bar'   // ✗ avoid
   }
   
   var obj = {
     foo: 'foo',
     bar: 'bar'   // ✓ ok
   }
   

   7.3 点号操作符须与属性需在同一行

   eslint: dot-location

    new Promise().
       then() // ✗ avoid
   
   new Promise()
       .then() // ✓ ok
       .catch()
   

   7.4 键值对当中冒号与值之间要留空白

   eslint: key-spacing

   let obj = { 'key' : 'value' } // ✗ avoid
   let obj = { 'key' :'value' } // ✗ avoid
   let obj = { 'key':'value' } // ✗ avoid
   let obj = { 'key': 'value' } // ✓ ok
   

   7.5 表达式末尾需要添加逗号的必须添加逗号

   let a = 1;
   const test = () => {};
   

8. 构造函数
   8.1 无参的构造函数调用时要带上括号

   eslint: new-parens

   function Animal () {}
   const dog = new Animal    // ✗ avoid
   const dog = new Animal()  // ✓ ok
   

   8.2 构造函数要以大写字母开头
   eslint: new-cap

   function animal () {}
   let dog = new animal();    // ✗ avoid
   
   function Animal () {}
   let dog = new Animal();    // ✓ ok
   
   class MyComponent extends Component() {}    // ✓ ok
   
   

其他注意事项

1. 不要使用 debugger

eslint: no-debugger

function setName() {
  debugger
  // do something
}

2. 不要使用 eval()
3. 注意隐式的 eval()
   eslint: no-implied-eval

setTimeout("alert('Hello world')")                   // ✗ avoid
setTimeout(function () { alert('Hello world') })     // ✓ ok

4. 不要扩展原生对象
   eslint: no-extend-native

Object.prototype.age = 21     // ✗ avoid

5. switch 一定要使用 break 来将条件分支正常中断
   eslint: no-fallthrough

switch (filter) {
  case 1:
    doSomething()    // ✗ avoid
  case 2:
    doSomethingElse()
}

switch (filter) {
  case 1:
    doSomething()
    break           // ✓ ok
  case 2:
    doSomethingElse()
}

switch (filter) {
  case 1:
    doSomething()
    // fallthrough  // ✓ ok
  case 2:
    doSomethingElse()
}

6. 如果有更好的实现，尽量不要使用三元表达式
   eslint: no-unneeded-ternary

let score = val ? val : 0     // ✗ avoid
let score = val || 0          // ✓ ok

7. return，throw，continue 和 break 后不要再跟代码。
   eslint: no-unreachable

function doSomething () {
  return true
  console.log('never called')     // ✗ avoid
}

8. 避免不必要的 .call() 和 .apply()
   eslint: no-useless-call

sum.call(null, 1, 2, 3)   // ✗ avoid

9. ajax返回的数据需要明确字段类型，需要进行空值判断

let arr = response.data || [];
let obj = response.data || {};

10. 注释//与注释内容之前需要空格

11. 请尽量使用es6、es7语法

const func = (arguments) => {
  // do someting
}

let {a = 0, b = {}} = obj;

async / await
...

未完待续...