编程风格

块级作用域

let 取代 var

ES6提出了两个新的声明变量的命令：let和const。其中，let完全可以取代var，因为两者语义相同，而且let没有副作用。

全局常量和线程安全

在let和const之间，建议优先使用const，尤其是在全局环境，不应该设置变量，只应设置常量。

// bad
var a = 1, b = 2, c = 3;
// good
const a = 1;
const b = 2;
const c = 3;
// best
const [a, b, c] = [1, 2, 3];

了解更多👉：let与const

字符串

静态字符串一律使用单引号或反引号，不使用双引号。动态字符串使用反引号。

// bad
const a = "foobar";
const b = 'foo' + a + 'bar';
// acceptable
const c = `foobar`;
// good
const a = 'foobar';
const b = `foo${a}bar`;
const c = 'foobar';

了解更多👉：字符串的扩展

解构赋值

使用数组成员对变量赋值时，优先使用解构赋值。

函数的参数如果是对象的成员，优先使用解构赋值。

如果函数返回多个值，优先使用对象的解构赋值，而不是数组的解构赋值。这样便于以后添加返回值，以及更改返回值的顺序。

1
2
3

const [first, second] = arr;
function getFullName({ firstName, lastName }) { }
const { left, right } = processInput(input);

了解更多👉：解构赋值

对象

单行定义的对象，最后一个成员不以逗号结尾。多行定义的对象，最后一个成员以逗号结尾。

const a = { k1: v1, k2: v2 };
const b = {
  k1: v1,
  k2: v2,
};

对象的属性和方法，尽量采用简洁表达法，这样易于描述和书写

var ref = 'some value';
const atom = {
  ref,
  value: 1,
  addValue(value) {
    return atom.value + value;
  },
};

了解更多👉：对象的扩展

数组

使用扩展运算符（…）拷贝数组。

1	const itemsCopy = [...items];

使用Array.from方法，将类似数组的对象转为数组。

const foo = document.querySelectorAll('.foo');
const nodes = Array.from(foo);
//或者扩展运算符(...)
const nodes = [...foo];

了解更多👉：数组的扩展

函数

那些需要使用函数表达式的场合，尽量用箭头函数代替。因为这样更简洁，而且绑定了this。

使用rest运算符（…）代替参数

使用默认值语法设置函数参数的默认值。

[1, 2, 3].map(x => x * x);
function concatenateAll(...args) {
  return args.join('');
}
function handleThings(opts = {}) {
  // ...
}

了解更多👉：函数的扩展

Class

总是用Class，取代需要prototype的操作。因为Class的写法更简洁，更易于理解。

使用extends实现继承，因为这样更简单，不会有破坏instanceof运算的危险。

class A {
  constructor(contents = []) {
    ...
  }
  getA() {
    ...
  }
}
class B extends A {
  constructor() {
    super()
    ...
  }
  getB() {
    ...
  }
}

了解更多👉：Class

模块

使用import取代require。

使用export取代module.exports。

import { func1, func2 } from 'moduleA';
export default function () {
  console.log('foo');
}

了解更多👉：Module