1. 对象和数组

• 使用字面量值创建对象和数组；
• 使用展开运算符 ... 复制数组；
• 优先使用对象展开运算符 ... 来做对象浅拷贝而不是使用 Object.assign。
  undefined 判断

推荐

const obj = {}
const arr = []

const arrOrg = [1, 2, 'c']
const arrCopy = [...arrOrg]

const objOrg = { a: 1, b: 2 }
const objCopy = { ...objOrg, c: 3 }

不推荐

const obj = new Object{}
const arr = new Array()

const arrOrg = [1, 2, 'c']
const temp = arrOrg.slice()
const arrCopy = temp.concat()

const objOrg = { a: 1, b: 2 }
const objCopy = Object.assign({}, objOrg, { c: 3 })

2. 解构赋值

• 需要使用对象的多个属性时，使用解构赋值；
• 需要使用数组的多个值时，使用解构赋值；

推荐

function getFullName (user) {
    const { firstName, lastName } = user

    return `${firstName} ${lastName}`
}

const arr = [1, 2, 3, 4]
const [first, second] = arr

不推荐

function getFullName (user) {
    const firstName = user.firstName
    const lastName = user.lastName

    return `${firstName} ${lastName}`
}

const arr = [1, 2, 3, 4]
const first = arr[0]
const second = arr[1]

3. 链判断运算符(?.)

• 帮助解决取结构深层数据的情况；
• 当取值超过3层时，建议使用。
  比如：let price = data.result.redPacket.price
  当某一个key不存在时，undefined.key就会报错

// 推荐
let name = data?.user?.name || ''
let name = data && data.user && data.user.name || ''

let price = data?.result?.redPacket?.price || ''

// 不推荐
let price = data && data.result && data.result.redPacket && data.result.redPacket.price || ''

这样即使某一个key不存在，也不会报错，只会返回undefined。
相关语法：

a?.b    // 等同于 a == null ? undefined : a.b
a?.[x]  // 等同于 a == null ? undefined : a[x]
a?.b()  // 等同于 a == null ? undefined : a.b()
a?.()   // 等同于 a == null ? undefined : a()

4. 比较运算符&相等

• 使用 === 和 !== 而非 == 和 !=；

// 推荐
if (+res.code === 200) {
    ...
}

// 不推荐
if (res.code == 200) {
    ...
}

5. 三目运算符

• 条件判断能使用三目运算符和逻辑运算符解决的，就不要使用条件判断；
• 不要写太长的三目运算符，如果超过 3 层抽成函数。