Vuex学习准备（数组对象的解构以及扩展运算符）

写在前面：学习vuex必须理解和掌握几个简单的ECMAScript6或者7的方法知识！

数组赋值解构：

let arr = ['Z_D_殿峰', 18, 60]
let [name, age, weight] = arr

console.log(name) // => Z_D_殿峰
console.log(age) // => 18
console.log(weight) // => 60

数组函数传参解构：

function arrayFun2([name, age, weight]) {
  console.log(name) // => Z_D_殿峰
  console.log(age) // => 18
  console.log(weight) // => 60
}

let arr = ['Z_D_殿峰', 18, 60]
arrayFun2(arr)

对象赋值解构：

obj = {
  name: 'Z_D_殿峰',
  age: 18,
  weight: 60
}
let {name, age, weight} = obj

console.log(name) // => Z_D_殿峰
console.log(age) // => 18
console.log(weight) // => 60

对象函数传参解构：

function objFun2({name, age, weight}) {
  console.log(name) // => Z_D_殿峰
  console.log(age) // => 18
  console.log(weight) // => 60
}
obj = {
  name: 'Z_D_殿峰',
  age: 18,
  weight: 60
}
objFun2(obj)

数组扩展运算符

• 扩展运算符用三个点号(...)表示，功能是把数组或类数组对象展开成一系列用逗号隔开的值

    function arrayFun3(name, age, weight) {
      console.log(name) // => Z_D_殿峰
      console.log(age) // => 18
      console.log(weight) // => 60
    }
    let arr = ['Z_D_殿峰', 18, 60]// => ... = 'Z_D_殿峰', 18, 60
    arrayFun3(...arr)

对象扩展运算符

• 也是三个点号(...)表示，对象的解构赋值用于从一个对象取值，相当于将目标对象自身的所有可遍历的、但尚未被读取的属性，分配到指定的对象上面。所有的键和它们的值，都会拷贝到新对象上面。

    let obj = {
      name: 'Z_D_殿峰',
      age: 18,
      weight: 60
    }
    let obj1 = {
      job: '程序员'
    }
    let obj2 = {...obj, ...obj1}
    console.log(obj2) //=> { age: 18, job: "程序员", name: "Z_D_殿峰", weight: 60 }

    let {name, ...obj3} = {...obj2}
    console.log(name) // => 'Z_D_殿峰'
    console.log(obj3) // {age: 18, weight: 60, job: "程序员"}