在学习ES6的解构赋值之前，我们先了解一下ES5中，如果想要获取某个属性的值，我们一般采用obj.属性名

ES5

 const person = {
      name: "木柔",
      age: 20,
      sex: "女"
    }
    console.log(person.name);
    console.log(person.age);
    console.log(person.sex);

解构赋值

const person = {
      name: "木柔",
      age: 20,
      sex: "女"
    }
    const {name,age,sex}=person;
    console.log(name,age,sex);

常见的解构赋值有3种：

对象的解构赋值

 开发技巧

1.指定别名

 function fn(user) {
      const {name:userName,age:userAge}=user;
      console.log(`${userName},${userAge}`);//木柔,23
    }
    const name="木柔";
    const age=23;
    fn({name,age})

2.部分解构

 function fn(user) {
      const {name}=user;
      console.log(`用户名：${name}`);//木柔
    }
    const name="木柔";
    const age=23;
    fn({name,age})

3.嵌套解构

 function fn (user) {
      const { name: { firstname, lastname } } = user;
      console.log(`姓：${firstname}`);//姓：木
      console.log(`名：${lastname}`);//名：柔
    }
    const user = {
      name: {
        firstname: "木",
        lastname: "柔"
      },
      age: 23
    }
    fn(user);

4.解构方法

 const {max,min}=Math;
    console.log(max(1,2,3));//3
    console.log(min(1,2,3));//1
//分析
//对象的方法本质上就是对象的属性，只不过这个属性的值是一个函数而已。如果一个对象有很方法，我们只需要用到其中几个的话，就可以像上面的例子这样进行解构赋值。


上面这个例子等价于下面的代码：
console.log(Math.max(1,2,3));
console.log(Math.min(1,2,3));

数组的解构赋值

数组解构和对象解构其实是非常相似的，两者都可以进行这些操作:完全解构、部分解构、嵌套解构。

1.完全解构

 const [a,b,c]=[20,30,40];
    const result=a+b+c;
    console.log(result);//90

2.部分解构

 const [a,b]=[20,30,40];
 console.log(a);//20
 console.log(b);//30

3.嵌套解构

 const [a,b,[c,d]]=[20,30,["html","css"]];
 console.log(c);//html
 console.log(d);//css

深入了解数组解构

 应用场景

 总结

 字符串解构

字符串其实是一个类数组，因此我们也可以对字符串进行解构赋值。

let [a,b,c,d]="我爱代码";
console.log(a);//我

//分析
//既然字符串是一个类数组，我们也可以使用数组解构赋值的其他功能，比如默认值、连续逗号。