JS简洁写法总结

条件判断给变量赋值布尔值

if (a === 'a') {
    b = true
} else {
    b = false
}

简洁写法：  b = a === 'a'

判断数组长度不为零

if (arr.length !== 0) {
// todo
}

简洁写法：if (arr.length) {// todo}

判断数组长度为零

if (arr.length === 0) {
// todo
}

简洁写法： if (!arr.length) {// todo}

三元表达式

if (a === 'a') {
  b = a
} else {
  b = c
}

简洁写法：b = a === 'a' ? a : c

includes简化if判断

if (a === 1 || a === 2 || a === 3 || a === 4) {
  // todo
}

简洁写法：let arr = [1, 2, 3, 4]
         if (arr.includes(a)) { }

some方法判断是否有满足条件的元素

 let arr = [1, 3, 5, 7]
    function isHasNum (n) {
        for (let i = 0; i < arr.length; i ++) {
          if (arr[i] === n) {
            return true
          }
    }
    return false
  }

简洁写法：let arr = [1, 3, 5, 7]
         let isHasNum = (n, arr) => arr.some(num => num === n)

forEach方法遍历数组，不形成新数组

 for (let i = 0; i < arr.length; i ++) {
    // todo
    arr[i].key = balabala
}

简洁写法：arr.forEach(item => {
          // todo
          item.key = balabala
        })

filter方法过滤原数组，形成新数组

newArr = []
for (let i = 0; i < arr.length; i ++) {
  if (arr[i] > 4) {
    newArr.push(arr[i])
  }
}

简洁写法：let arr = [1, 3, 5, 7]
         let newArr = arr.filter(n => n > 4) // [5, 7]

map对数组中所有元素批量处理，形成新数组

let arr = [1, 3, 5, 7],
newArr = []
for (let i = 0; i < arr.length; i ++) {
 newArr.push(arr[i] + 1)
}

简洁写法：let arr = [1, 3, 5, 7]
         let newArr = arr.map(n => n + 1) // [2, 4, 6, 8]

使用Object.values快速获取对象键值

let obj = {
    a: 1,
    b: 2
}
let values = []
for (key in obj) {
    alues.push(obj[key])
}

简洁写法：let values = Object.values(obj) // [1, 2]

使用Object.keys快速获取对象键名

let obj = {
    a: 1,
    b: 2
}
let keys = []
for (value in obj) {
    keys.push(value)
}

简洁写法：let keys = Object.keys(obj) // ['a', 'b']

解构数组进行变量值的替换

let a = 1,
    b = 2
let temp = a
    a = b
    b = temp

 简洁写法：let a = 1,
          b = 2
          [b, a] = [a, b]

解构对象

setForm (person) {
  this.name = person.name
  this.age = person.age 
}

简洁写法：setForm ({name, age}) {
          this.name = name
          this.age = age 
        }

解构时重命名简化命名

 setForm (data) {
  this.one = data.aaa_bbb_ccc_ddd
  this.two = data.eee_fff_ggg
}

简洁写法：setForm ({aaa_bbb_ccc_ddd: one, eee_fff_ggg: two}) {
         this.one = one
         this.two = two
        }

解构时设置默认值

setForm ({name, age}) {
  if (!age) age = 16
  this.name = name
  this.age = age 
}

 简洁写法：setForm ({name, age = 16}) {
          this.name = name
          this.age = age 
         }

||短路符设置默认值

let person = {
  name: '张三',
  age: 38
}

简介写法：let name = person.name || '佚名'

&&短路符判断依赖的键是否存在防止报错'xxx of undfined'

let person = {
name: '张三',
age: 38,
children: {
  name: '张小三'
 }
}

简介写法：let childrenName = person.children && person.childre.name

函数参数校验

let findStudentByAge = (arr, age) => {
  if (!age) throw new Error('参数不能为空')
  return arr.filter(num => num === age)
}

简洁写法：let checkoutType = () => {
         throw new Error('参数不能为空')
         }
        let findStudentByAge = (arr, age = checkoutType()) =>
        arr.filter(num => num === age)

从数组对象中抽出指定值组成数组并拼接字符串

  const arr = [
            { 
                name:"八百",
                id:234
            }，
             { 
                name:"八百",
                id:234
            }，
            ]
 const newStr =  arr.map(({ name }) => name).join('、');