Skip to content

Latest commit

 

History

History
413 lines (302 loc) · 6 KB

4. JavaScript规范.md

File metadata and controls

413 lines (302 loc) · 6 KB
Raw

代码缩进

使用带有两个空格的 Tab 作为缩进。


分号

语句的末尾都要加分号。

/* 变量声明 */
let x = 1;

/* 表达式 */
x++;

/* do-while */
do {
  x++;
} while (x < 10);

空格

以下几种情况需要空格：

// 二元运算符前后
const a = b + c;

// 三元运算符 '?:' 前后
const a = b ? 1 : 2;

// 在 '(' 前面没有空格，'{' 前面有一个空格，函数参数之间要有一个空格
const doSomething = function(a, b, c) {
  ...
};

// for 循环，分号后留有一个空格，前置条件如果有多个，逗号后留一个空格
for (i = 0; i < 6; i++) {
  x++;
}

// 下列关键字前：else, while, catch, finally
try {
  ...
} catch (e) {
  ...
} finally {
  ...
}

引号

最外层统一使用单引号。

// 不推荐
const bad = "test";

// 推荐
const good = 'test';

括号

下列关键字后必须有大括号（即使代码块的内容只有一行）：if, else, for, while, do, switch, try, catch, finally, with。

// 不推荐
if (condition)
  doSomething();

// 推荐
if (condition) {
  doSomething();
}

等号

用 ===, !== 代替 ==, !=

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

// 推荐
if (a === b) {}

变量声明

  • 不要使用 var 声明
  • 对所有引用都使用 const 声明
  • 如果引用是可变的，使用 let 声明
// 不推荐
var obj = {};
var count = 1;

if (count < 10) {
  count += 1;
}

// 推荐
const obj = {};
let count = 1;

if (count < 10) {
  count += 1;
}

变量命名

  • 标准变量采用驼峰式命名
const thisIsMyName;
  • 常量全大写，用下划线连接
const MAX_COUNT = 10;
  • 构造函数或者类，大写第一个字母
function Person(name) {
  this.name = name;
}

class Person {}

数组、对象

  • 对象只对含非法标识符的属性名加引号；
// 不推荐
const bad = {
  'foo': 1,
  'bar-data': 2
};

// 推荐
const bad = {
  foo: 1,
  'bar-data': 2
};
  • 对象以缩进的形式书写，不要写在一行；
// 不推荐
const bad = {foo: 1};

// 推荐
const good = {
  foo: 1
};
  • 使用对象属性值的简写方式
const job = 'FrontEnd'

// 不推荐
const item = {
  job: job
}

// 推荐
const item = {
  job
}
  • 将简写的对象属性分组后统一放到对象声明的开头
const job = 'FrontEnd';
const department = 'Huaer';

// 不推荐
const item = {
  sex: 'male',
  job,
  age: 25,
  department
};

// 推荐
const item = {
  job,
  department,
  sex: 'male',
  age: 25
};
  • 数组、对象最后不要有逗号。
// 不推荐
const bad = {
  foo: 1,
  bar: 2,
};

// 推荐
const good = {
  foo: 1,
  bar: 2
};
  • 优先使用对象展开运算符 ... 来做对象浅拷贝，而不是 Object.assign
// 不推荐
const original = { a: 1, b: 2 };
const copy = Object.assign(original, { c: 3 });
delete copy.a; // original对象会受到影响

// 推荐
const original = { a: 1, b: 2 };
const copy = { ...original, c: 3 };

函数

  • 不要使用Function构造函数创建函数
// 不推荐
const add = new Function('a', 'b', 'return a + b')
  • 不要在非函数代码块（if , while 等）中声明函数
// 不推荐
if (isUse) {
  function test () {
    // do something
  }
}

// 推荐
let test
if (isUse) {
  test = () => {
    // do something
  }
}
  • 不要使用 arguments，使用剩余运算符 ...
// 不推荐
function test () {
  const args = Array.prototype.slice.call(arguments)
  return args.join('')
}

// 推荐
function test (...args) {
  return args.join('')
}
  • 当你必须使用函数表达式（传递匿名函数）时，优先使用箭头函数
// 不推荐
[1, 2, 3].map(function (x) {
  const y = x + 1
  return x * y
})

// 推荐
[1, 2, 3].map((x) => {
  const y = x + 1
  return x * y
})

单行注释

  • 双斜线后，必须跟一个空格；

  • 缩进与下一行代码保持一致；

  • 可位于一个代码行的末尾，与代码间隔一个空格。

if (condition) {
  // 缩进与下一行代码保持一致
  allowed();
}

const zhangsan = 'zhangsan'; // 与代码间隔一个空格

多行注释

  • 最少三行, '*' 后跟一个空格，具体参照下面的写法

  • 建议在以下情况下使用：

    • 难于理解的代码段
    • 可能存在错误的代码段
    • 业务逻辑强相关的代码
/*
 * '*' 后跟一个空格
 */
let x = 1;

文档注释

  • 各类标签 @param, @method 等请参考 usejsdoc 和 JSDoc Guide；

  • 建议在以下情况下使用：

    • 工具函数
    • 所有类
/**
 * @func
 * @desc 一个带参数的函数
 * @param {string} a - 参数a
 * @param {number} b=1 - 参数b默认值为1
 * @param {string} c=1 - 参数c有两种支持的取值</br>1—表示x</br>2—表示xx
 * @param {object} d - 参数d为一个对象
 * @param {string} d.e - 参数d的e属性
 * @param {string} d.f - 参数d的f属性
 * @param {object[]} g - 参数g为一个对象数组
 * @param {string} g.h - 参数g数组中一项的h属性
 * @param {string} g.i - 参数g数组中一项的i属性
 * @param {string} [j] - 参数j是一个可选参数
 */
function foo(a, b, c, d, g, j) {
  ...
}

杂项

  • 不要混用 tab 和 space

  • 换行符统一用 'LF'

  • 行尾不要有空白字符

  • 不允许有空的代码块

  • debugger 不要出现在提交的代码里

  • 如无必要不要提交console.log

// 不允许有空的代码块
if (condition) {

}

// 如无必要不要提交console.log
console.log();

// 可以使用 console.warn
console.warn();

// 或使用 eslint 注释
// eslint-disable-next-line
console.log();