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)
 }
相關文章
相關標籤/搜索