ES6中对象的解构赋值多重情况详解

代码如下

// (1) 左侧简写形式
let obj={
  title:'xc',
  height:'180cm',
  bodyWeight:'70kg'
}
let {title,height,bodyWeight}=obj //左侧简写的形式和obj中定义的属性要一样 ,如果不一样为 该变量为undefined
console.log(title,height,bodyWeight)

// (2) 左侧不简写形式
let obj={
  title:'xc',
  height:'180cm',
  bodyWeight:'70kg'
}
let {title:title2}=obj
console.log(title2) 

// (3) 结合...运算符
let obj={
  title:'xc',
  height:'180cm',
  bodyWeight:'70kg'
}
let {title,...result}=obj
console.log(title,result)  //'xc', {height: "180cm", bodyWeight: "70kg"}

// (4) 复杂数据解构
let obj={
  type:{
    title:'xc',
    height:'180cm',
    bodyWeight:'70kg'
  },
  list:['a','b'],
  isOf:true
}

let { type:{ height,title }, list:[list1,list2] }=obj //左侧解构需要做到与右侧一一对应
console.log(height,title,list1,list2) //180cm xc a b