什么是解构？
解构与构造数据截然相反。 例如，它不是构造一个新的对象或数组，而是逐个拆分现有的对象或数组，来提取你所需要的数据。可以快速取得数组或对象当中的元素或属性，而无需使用arr[x]或者obj[key]等传统方式进行赋值。
ES6使用了一种新模式来匹配你想要提取的数值, 解构赋值就是采用了这种模式。 该模式会映射出你正在解构的数据结构，只有那些与该模式相匹配的数据，才会被提取出来。
被解构的数据项位于赋值运算符 = 的右侧，可以是任何数组和对象的组合，允许随意嵌套。用于给这些数据赋值的变量个数不限。
直白解释:模式匹配,映射关系,只要等号两边的模式相同,一一对应,左边的变量就会被赋予对应的值。
对象解构
最基本的解构
// ES6年代我们都不怎么用var，用const就感觉很厉害的样子
const userInfo = {
name: 'Lily',
age: '18'
};
// 解构开始
const { name, age } = userInfo; // 此处有风险，最好改为 userInfo || {}
console.log(name); // Lily
解构并使用别名
有时接口定义的字段往往不是我们想要的，甚至是和我们其他变量存在冲突，我们该怎么办呢？我也很无奈，叫后台改呗（你可能会被打死😝）！其实我们在解构时也可以设置别名。
const userInfo = {
name: 'Lily',
age: '18'
};
// 解构开始
const { name: nickName } = userInfo;// 此处有风险，最好改为 userInfo || {}
console.log(nickName);
解构嵌套对象
// 后台返回的数据
var userInfo = {
name: 'Lily',
age: '18',
education: {
degree: 'Masters',
school: 'SYSU'
}
};
const { education } = userInfo; // 此处有风险，最好改为 userInfo || {}
const { degree } = education // 此处有风险，后面会说明
console.log(degree); // Masters
上面我们写了两行，一层层剥开，明显繁琐，如果这个对象有三四层结构那简直无法入目。其实可以用解构一步到位的：
// 后台返回的数据
const userInfo = {
name: 'Lily',
age: '18',
education: {
degree: 'Masters',
school: 'SYSU'
}
};
const { education: { degree }} = userInfo;// 此处有风险，后面会说明
console.log(degree); // Masters
没有外层怎么办
//会报错
// 后台返回的数据
const userInfo = {
name: 'Lily',
age: '18'
};
const { education: { degree }} = userInfo;// TUncaught TypeError: Cannot destructure property `degree` of 'undefined' or 'null'.
如果你是一个前端老鸟，一定知道其实我们的对象解构也是可以设置缺省值的。
// 后台返回的数据
const userInfo = {
name: 'Lily',
age: '18'
};
const {
education: {
degree
} = {}
} = userInfo || {};
console.log(degree); // undefined
这样一来我们的解构就完美了，就算后台挂了，我们也依然坚挺，雄起！！！
