【JavaScript19】解构赋值

JavaScript ES6 新增解构赋值，可以快读从数组或对象中取出成员。

• 解构: 将对象或者数组中的某个成员取出来；
• 赋值: 取出来的成员按顺序赋值给变量。

数组的解构赋值

• 使用中括号 [ ] 来进行解构数组， 需注意变量名称和数组的值一一对应;
• 或者把数组设置为一个变量,再解构

let [a, b, c] = ['hello', 'world', 'xwl'];
console.log(a, b, c);  // hello world xwl

aa = ['hello', 'world', 'xwl'];
let [a, b, c] = aa;
console.log(a, b, c);

• 如果变量的个数，少于数组的个数，变量会按顺序赋值，不会报错;
• 如果变量个数大于数组的个数，多余的变量为undefined

aa = ['hello', 'world', 'xwl'];
let [a, b] = aa;
console.log(a); // hello
console.log(b);  // world

aa = ['hello', 'world', 'xwl'];
let [a, b, c, d] = aa;
console.log(a);
console.log(b);
console.log(c);
console.log(d);  // undefined

对象的解构赋值

• 对象的解构用大括号{}

const person = {
    name: 'xwl',
    age: 20,
    address: () => {
        return "东莞市"
    }
}
let {name, age, address} = person;
console.log(name); // xwl
console.log(age);  // 20
console.log(address());  // 东莞市