es6解构赋值--对象

/**
 * 对象 的解构赋值
 */

 //对象的属性没有次序,变量必须与属性同名,才能取到正确的值
 //对象的解构赋值的机制是,先找同名属性, 而后再赋值给对应的变量
 {
   let {age, name} = {name: 'jordan', age: 12}
   console.log(name, age) // jordan  12
 }

 // 变量名和属性名不一致
 {
   let {foo: name, foz: age} = {foo: 'jordan', foz: 23}
   console.log(name, age) // jordan  23  这里foo和foz是匹配的模式, name和age才是变量
 }


 // 对象解构赋值的嵌套
 {
   let obj = {
     name: 'jordan',
     children: {
       name: 'lee',
       age: 12
     }
   }
   let {name: parentName, children, children: {name: childName, age}} = obj;
   console.log(parentName, children, childName, age) // jordan   {childName: 'lee', age: 12}    lee    12
   // 注意什么是匹配的模式,什么是变量(变量的名字能够随意取, 匹配的模式必须与解构的对象属性名对应)
 }

 // 对象解构的默认值, 和数组同样,当对象的属性严格等于undefined时, 才会使用默认值
 {
   let {name ='jordan', age = 12} = {}
   console.log(name, age)

   let {message: msg = 'this is the message.'} = {}
   console.log(msg) // this is the message. (msg才是变量, messsage是匹配的模式)

   let {foo} = {name: 'jordan'}
   console.log(foo) // undefined
 }

 // 须要注意的是, 若是要使用一个先声明的变量进行解构赋值,要放在  () 里面,避免大括号在行首被当成代码块
 {
   let x;
   ({x} = {x: 'jordan'});
  //  {x} = {x: 'jordan'} 会报错
   console.log(x)
 }
相关文章
相关标签/搜索