VIP20/11_ES6/day-1/code/4.js

//! 对象解构

var obj = { foo: 'aaa', bar: 'bbb' };
//TODO 需求：创建两个变量 foo 和 bar；foo = obj.foo; bar = obj.bar
// var foo = obj.foo;
// var bar = obj.bar;

//TODO 对象解构

// let { foo: foo, bar: bar } = obj;

//! 上面对象解构的写法 是有简写方式的
// 由于 我们定义的变量 和 解构对象的属性名 一样，因此可以简写为如下形式：
let { foo, bar } = { foo: 'foo', bar: 'bar' };
console.log(foo, bar);

//! 实际工作中，为了使代码更简写通常我们在解构的时候，会定义变量名和其解构对象的属性名一致，这样就可以使用上面的简写语法格式

// 如果 上面已经定义了foo和bar变量，此时就不能在使用简写语法。
// let { foo, bar } = { foo: 'foo', bar: 'bar' };
//  我们就可以通过完整语法 对变量进行重命名
let { foo: foo1, bar: bar1 } = { foo: 'foo', bar: 'bar' };

console.log(foo1, bar1);

//! 同样，如果解构时失败了，那么定义的变量会赋予一个undefined值
let { baz } = { foo: 'aaa', bar: 'bbb' };
console.log(baz); // undefined