变量解构定义：ES6 允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构（Destructuring）。
一、 数组解构
1、基本用法
let [a, b, c] = [10, 20, 30]
console.log(a, b, c)//10 20 30
2、部分解构： 当你想取特定的值，其他的可以不解构，可以选择用额外的逗号进行丢弃
let [a, , c] = [10, 20, 30]
console.log(a, c)//10 30
3、 默认值：如果解构的数组可能缺少某些元素，我们可以为变量设置默认值
let [a, b = 10] = [3]
console.log(a, b);//3 10
注意点：ES6内部使用严格相等运算符（===），判断一个位置是否有值。所以，只有当一个数组成员严格等于undefined默认值才有效
let [a = 1] = [null]
console.log(a)//null
3.1 如果默认值是一个表达式，那么表达式是惰性求值的，即只有在用到的时候，才会求值。
function f() {
console.log('aaa');
}
let [a = f()] = [1];
console.log(a)//1
3.2 默认值可以引用解构赋值的其他变量，但该变量必须已经声明。
let [a = 1, b = a] = [];
console.log(a, b) // a=1; b=1
let [a = 1, b = a] = [2];
console.log(a, b) // a=2; b=2
let [a = b, b = 1] = [];
console.log(a, b) // ReferenceError: b is not defined
4、 剩余元素 使用扩展运算符（...）可以收集数组中的剩余元素：
let [a, ...b] = [1, 2, 3, 4]
console.log(a, b)//1 [2,3,4]
5、如果解构不成功，变量的值就等于undefined。
let [a, b, ...c] = [1];
console.log(a, b, c);//1 undefined []
6、不完全解构，即等号左边的模式，只匹配一部分的等号右边的数组
let [a, b] = [1, 2, 3]
console.log(a, b);//1 2
7、 对Set类型进行解构
let [a, b, c] = new Set([1, 2, 3])
console.log(a, b, c);//1 2 3
二、 对象解构
对象解构与数组有一个重要的不同。数组的元素是按次序排列的，变量的取值由它的位置决定的；而对象的属性没有次序。变量必须与属性同名，才能取正确的值
1、 基本用法
const { name, age } = { name: "liming", age: 20 }
console.log(name, age)// name="liming", age:=20
2、变量重命名：对象的解构赋值的内部机制，是先找到同名属性，然后在赋给对应的变量。真正被赋值的是后者，而不是前者
const { name: n, age: a } = { name: "liming", age: 20 }
console.log(n, a)// n="liming", a=20
3、默认值：如果对象中没有该属性，可以为变量提供默认值。
const { name, age = 18 } = { name: "liming" }
console.log(name, age)// name="liming", age=18
4、嵌套解构：可以解构嵌套的对象或数组。
const obj = { user: { name: "liming", age: 20 } }
const { user: { name, age } } = obj;
console.log(name, age)// name="liming", age=20
这是user模式，不是变量，因此不是被赋值，如果想要user也要作为哦变量赋值，可以写成下面这样
const obj = { user: { name: "liming", age: 20 } }
const { user, user: { name, age } } = obj;
console.log(user, name, age)//user={ name: "liming",age: 20} name = "liming", age = 20
注意点：
错误的写法
let a;
{ a } = { a: 1 };
console.log(a) //SyntaxError: syntax error
原因: 在于这个语句被解析为一个代码块，而不是一个解构赋值的语法。
三、字符串的解构赋值
const [a, b, c, d, e] = 'hello';
console.log(a, b, c, d, e)//a=h b=e c=l d=l e=o
四、函数参数的解构赋值
1、基本用法
function add([a, b]) {
return a + b;
}
console.log(add([1, 2])); // 3
const result = [[1, 2], [3, 4]].map(([a, b]) => a + b);
console.log(result);//[3, 7]
2、 函数参数的解构也可以使用默认值。
function move({ a = 0, b = 0 } = {}) {
return [a, b];
}
console.log(move({ a: 3, b: 8 })); // [3, 8]
move({ a: 3 }); // [3, 0]
move({}); // [0, 0]
move(); // [0, 0]
上面代码中，函数move的参数是一个对象，通过对这个对象进行解构，得到变量x和y的值。如果解构失败，x和y等于默认值。
注意，下面的写法会得到不一样的结果。
function move({ a, b } = { a: 0, b: 0 }) {
return [a, b];
}
move({ a: 3, b: 8 }); // [3, 8]
move({ a: 3 }); // [3, undefined]
move({}); // [undefined, undefined]
move(); // [0, 0]
