简单了解：解构

简释解构

对象的解构与数组有一个重要的不同。数组的元素是按次序排列的，变量的取值由它的位置决定；而对象的属性没有次序，变量必须与属性同名，才能取到正确的值

数组解构：

常用于交换变量

let a = 1;
let b = 2;
[a, b] = [b, a];
// a => 2,  b => 1

let [a,b] = [1];
console.log(a,b); 
// a => 1,  b => undefined

let arr = [1, 2, 3, 4];
let [a, b, ...rest] = arr;
console.log(rest, arr); 
// rest = [3, 4], arr = [1, 2, 3, 4]

对象解构:

变量和属性同名就可以

let { foo: a, bar: b } = { foo: "123", bar: "456" };
console.log(a, b); 
// a => "123" , b => "456"
console.log(foo);
// error (foo is not defined)

也就是说，对象的解构赋值的内部机制，是先找到同名属性，然后再赋给对应的变量。真正被赋值的是后者，而不是前者。

const obj = {
    name:"zhangsan",
    age:18
};
const {name, gender} = obj;
console.log(name, gender); 
// name => "zhangsan", gender => undefined

let person = {
    name:"lisi",
    age:17
};
let { gender } = person; // 声明一个变量，并解构赋值
console.log( person.gender ); // undefined => 当访问不存在的变量属性时，值为undefined
gender = "male";
console.log( person.gender ); // undefined

let {name, age} = person;
name = "wangwu";
console.log(person.name); // name => "lisi"
// 解构赋值的变量，不改变原对象（变量存放在栈中）

函数参数的解构赋值

let obj = {
    name:"zhangsan",
	age:18,
    eat(food="西瓜"){
    // 设置默认值
        console.log("我喜欢吃！"+food)
    }
};
function foo({name="goomay",age=20}={}){
    // 设置默认值，不传参时，默认解构空对象，而空对象中没有属性，变量使用自身的默认值
    console.log("我是"+name+",今年"+age+"岁");
};
foo(obj); // 我是zhangsan,今年18岁
foo(); // 我是goomay,今年20岁

解构可以帮助你更方便快捷的访问对象属性和数组元素。

除了基本用法之外，数组解构还可以方便的交换变量，访问数组元素，做一些遵循不可变原则的操作。

被解构的值一定要包含一个迭代器（不只是数组和对象才可以结构）