目的：

提高代码简洁程度，写起来更加方便，可读性更高（个人感觉）

1. 数组合并和数组去重

直接使用ES6新增的拓展运算符

let a = [1, 2, 3, 4, 5]
let b = [6, 7, 8, 9, 10]
let c = [...a, ...b]
console.log(c) // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

一般的数组去重就直接用new Set()就好，之前写的时候还各种用循环

let a = [1, 1, 2, 3]
let b = [1, 2, 3, 4]
let c = [...new Set([...a, ...b])]
console.log(c) // [1, 2, 3, 4]

2. 解构赋值

真正习惯用之后感觉代码量少了一截

let obj = {
    name: "Alex",
    age: "20",
    a: "XXX",
    b: "XXX"
}
let {name, age, a, b} = obj
// 自定义命名
let {name: studentName, age: studentName, a: studentA, b: studentB} = obj
console.log(studentName) // Alex

3. 处理后端返回样式不生效的问题

添加css样式 white-space: pre-wrap

4. 处理导出时后端传输文件流的处理方法

exportOutTo () {
  let data = this.getSendData
  // 获取导出时的时间
  let _this = this
  let yy = new Date().getFullYear()
  let mm = new Date().getMonth() + 1
  let dd = new Date().getDate()
  _this.gettime = yy + '' + mm + '' + dd

  this.$axios({
    url: this.exportUrl,
    method: 'post',
    data: data,
    responseType: 'blob' // 后端给文件流导出的必加条件，将json转换成blob
  }).then((res) => {
    // 一连串的数据转换
    const content = res.data
    const blob = new Blob([content])
    const fileName = _this.exFileName + '_' + _this.gettime + '.xlsx'
    // 输出时会给出文件大小，当表中有1条数据的时候，size为4000多，所以在这里进行判断
    if (content.size > 100) {
      if ('download' in document.createElement('a')) {
        // 数据类型，href转换等
        const elink = document.createElement('a')
        elink.download = fileName
        elink.style.display = 'none'
        elink.href = URL.createObjectURL(blob)
        document.body.appendChild(elink)
        elink.click()
        URL.revokeObjectURL(elink.href) // 释放URL 对象
        document.body.removeChild(elink)
      }
    } else {
      this.$Message.error('数据表无数据')
    }
  })
}

5. Vue解决父子组件传值，子组件改变值后父组件的值也改变的问题

这里主要还是深浅拷贝的问题

通过JSON.parse(JSON.stringify(data))将父组件的数据进行拷贝，然后赋值给子组件中字段,子组件操作只是改变的子组件的值，而不会改变父组件的值

6. 类型断言

告诉解析器变量的实际类型（目前也就是平时随便刷的时候刷到的，具体我个人还没有在项目中使用过，只有用过了补充场景）

语法：① 变量 as 类型；②<类型>变量；

例子：

a = b as number
a = <number>b

前端好用的方法收集

目的：