什么是解构赋值

ES6提出了一种解构赋值的方法，让我们更方便的从对象或数组中拿到数据并赋值

对象的解构

以前我们想从一个对象，或者一个数组中拿到数据赋值给一个变量是不是得使用下面的写法。

const obj = {
    name: "jack",
    age: 18,
    sex: male
}
const name = obj.name;
const age = obj.age;
const sex = obj.male

当ES6提出了解构赋值的语法的时候，上面这种写法就落后了，可以写成

const obj = {
    name: "jack",
    age: 18,
    sex: "male"
}

// 使用大括号表示对对象进行结构
const {name, age, sex} = obj;
console.log(name);      // jack
console.log(age);       // 18
console.log(sex);       // male

如果只想赋值其中的某一个或几个的话可以写成

const obj = {
    name: "jack",
    age: 18,
    sex: "male"
}

// 使用大括号表示对对象进行结构
const {name} = obj;
console.log(name);      // jack

数组的解构

数组的解构跟对象类似，但也差不多，直接看例子

const arr = ["苹果", "三华李", "菠萝"];
const [apple, plum, ananas] = arr;
console.log(apple);     // 苹果
console.log(plum);      // 三华李
console.log(ananas);    // 菠萝

如果只想获取“苹果”和“菠萝的时候”，可以写成

const arr = ["苹果", "三华李", "菠萝"];
const [apple, , ananas] = arr;
console.log(apple);         // 苹果
console.log(ananas);        // 菠萝

如果不需要该位置的值的话，直接留空就好。但是我们一般是使用对象解构的多，因为数组是根据索引顺序进行赋值的，如果数组很长的话使用解构就很难办。