如何解构 es6 javascript 嵌套对象答案

【问题标题】：How to destructure es6 javascript nested objects如何解构 es6 javascript 嵌套对象
【发布时间】：2019-11-28 11:28:59
【问题描述】：

我想在 es6 中构造对象但没有得到结果。

let animal ={
      data:{
          typee:{
              title: "Cow",
              legs:4
          }
      }
} 

let {data:{typee:{title,legs}}}=animal;

现在console.log(data) 给出输出Error: data is not defined。我做错了什么？

【问题讨论】：

如果你愿意，为什么不直接let { data } = animal;？
目前还不清楚你想用什么变量结束。你想要title 和legs、data 和typee，还是全部四个？

标签： javascript ecmascript-6 destructuring

【解决方案1】：

当解构嵌套对象时，中间值不会分配给常量/变量。您必须明确分配它们：

const animal = {"data":{"typee":{"title":"Cow","legs":4}}};

const {
  data, // assign the data
  data: {
    typee, // assign the typee
    typee: {
      title,
      legs
    }
  }
} = animal;

console.log(data, typee, title, legs);

【讨论】：

@ Ashwani - 如果你想要这些变量，你只需要 data, 和 typee, 部分（正如你的 console.log(data) 声明所建议的那样）。如果您只是想要title 和legs，请离开data, 和typee,。
呵呵，其实我的意思正好相反。 :-) 如果他们只想要title 和legs，他们可以使用{data: {typee: {title, legs } } }。我基本上认为这是问题中错误的console.log，他们这样做只是为了调试或其他东西，而不是解构。无论如何，好的答案，告诉他们发生了什么，如果他们想要data 和typee，如何获得它们。

【解决方案2】：

let {data:{typee:{title,legs}}}=animal;

创建title 和legs 而不是data。如果您还想获得其他封装属性之一，则必须单独指定它：

//creates data along with title and legs
let {data, data:{typee:{title,legs}}}=animal;
console.log(data,title,legs);

【讨论】：