学习记录——ES6语法（2）：解构赋值（数组解构、对象解构）

解构赋值
ES6中允许从数组中提取值，按照对应位置，对变量赋值。
对象也可以实现解构。

数组解构

let arr = [1, 2, 3]
let [a, b, c] = arr

或者
//数组解构允许我们按照一一对应的关系从数组中提取值，然后将值赋值给变量
let [a, b, c] = [1, 2, 3];

console.log(a);
console.log(b);
console.log(c);

数组解构允许我们按照一一对应的关系从数组中提取值（严格按照顺序来），然后将值赋值给变量

• 等号右边是数组 数组中有3个值

• 等号左边不是数组 代表解构 中括号里写的实际是变量的名字 代表从数组当中提取值

• 中括号中的变量和右边数组中的值 实际上是一一对应的关系
  比如 a变量的值是1 b=2 c=3

• 中括号前面的let代表 中括号中的变量是使用let关键字声明的

如果变量的数量 和 值的数量 不一致 值会变为undefined

    //如果变量的数量 和 值的数量 不一致 值会变为undefined
    //let [foo] = [];
    //console.log(foo);//undefined

    let [bar, foo] = [1];
    console.log(bar); //1
    console.log(foo); //undefined

对象解构

数组的元素是按次序排列的，变量的取值由它的位置决定。而对象的属性没有次序，变量必须与属性同名，才能取到正确的值

   //对象解构允许我们使用变量的名字匹配对象的属性 匹配成功 将对象属性的值赋值给变量
    let person = {
        name: 'user',
        age: 20
    };
    let {
        name,
        age
    } = person;
    console.log(name); //user
    console.log(age); //20

对象解构允许我们使用变量的名字匹配对象的属性 匹配成功 将对象属性的值赋值给变量。

• 对象解构 在等号的左边用大括号{ }表示，大括号中依然写的是变量的名字
• 在等号的右边 要写具体被解构的对象
• 对象解构 实际上是属性匹配 变量的名字匹配对象中属性的名字
• 如果匹配成功 就将对象中属性的值 赋值给变量

    另一种写法
    在对象的解构语法中，等号左侧大括号里的语法可以写成和对象一样
    在这种情况下，大括号里，冒号左边的属性 用来匹配 对象当中的属性
    冒号右边的才是真正的变量
    如果属性匹配成功 则将对象中属性对应的值 赋值给左侧的变量
    let {
        name: myName,
        age: myAge
    } = person;
    console.log(myName); //user
    console.log(myAge); //20