解构-对象解构

什么是解构

使用ES6的一种语法规则，将一个对象或数组的某个属性提取到某个变量中。

解构不会对被解构的目标造成任何影响。

解构语法可用于解构对象和解构数组。

原版代码：

const user = {
    name: 'lisa',
    age: 20,
    sex: '女',
    address: {
        province: '江苏',
        city: '无锡'
    }
}

let name, age, sex, address;
name = user.name;
age = user.age;
sex = user.sex;
address = user.address;

解构代码：

let name, age, sex, address;
({ name, age, sex, address } = user);

// 不写括号报错，因为系统把等号左边看成对象字面量，赋值符号左边不能是对象字面量；等号和右边看成赋值语句，看成赋值语句缺失变量。写括号是把它看成整体

解构代码简化版:

// 先定义四个变量，然后从对象中读取同名属性，放到对象中
let { name, age, sex, address } = user

在解构中使用默认值

当解构的同名属性不存在，显示undefined（相当于定一个变量，未赋值）

let { name, age, sex, address, abc = 123 } = user

非同名属性解构

// 先定义四个变量：name、age、gender、address
// 再从对象user中读取同名属性赋值（其中gender读取的是sex属性）
let { name, age, sex: gender, address } = user;
console.log(name, age, gender, address);  

若解构的属性较深，该如何写？

// 解构出user中的name，province
// 定义两个变量 name，province
// 再解构（把user里的name赋给变量name，把user里的address里的province赋给变量province）
let { name, address: { province } } = user;