对象赋值的嵌套解构答案

【问题标题】：Nested Destructuring on Object Assignments对象赋值的嵌套解构
【发布时间】：2017-03-18 16:01:45
【问题描述】：

使用 ES6 解构，他们有什么方法可以在赋值时解构嵌套对象吗？

这是一个快速的代码示例来说明我的意思：

let node = {
  ItemTitle: 'Title',
  ItemId: 5,
  Menu: {Item: [{ItemId: 579}]
}

 // my attempts
  let {
      ItemId: id,
      ItemTitle: title, 
      Menu['Item']: subItems
    } = node

  let {
      ItemId: id,
      ItemTitle: title, 
      Menu.Item: subItems
    } = node

【问题讨论】：

标签： javascript ecmascript-6 javascript-objects

【解决方案1】：

您可以对嵌套级别重复与解构顶层相同的语法：

根据您的评论进行编辑

我需要数组中的对象

let node = {
  ItemTitle: 'Title',
  ItemId: 5,
  Menu: {Item: [{ItemId: 579}]}
}

let {
  ItemId: id,       // extract `node.ItemId` into a variable called `id`
  ItemTitle: title, // extract `node.ItemTitle` into a variable called `title`
  Menu: {
    Item: [obj]     // extract `node.Menu.Item[0]` into a variable called obj
  }
} = node;

console.log('id =', id);
console.log('title =', title);
console.log('obj =', obj);

预编辑：提取嵌套数组中对象的 id。

let node = {
  ItemTitle: 'Title',
  ItemId: 5,
  Menu: {Item: [{ItemId: 579}]}
}

let {
  ItemId: id,           // extract `node.ItemId` into a variable called `id`
  ItemTitle: title,     // extract `node.ItemTitle` into a variable called `title`
  Menu: {
    Item: [{ 
      ItemId: subItemId // extract `node.Menu.Item[0].ItemId` into a variable called `subItemId`
    }]  
  }
} = node;

console.log('id =', id);
console.log('title =', title);
console.log('subItemId =', subItemId);

【讨论】：

谢谢你的回答，我现在明白了。如果您查看我的示例，node.Menu.Item 是一个数组。如何解构对象的数组属性？
你需要数组的哪一部分，数组中的对象还是那个对象的ItemId属性？
谢谢，我需要数组中的对象。
太好了，非常感谢你让我这么清楚。
@rm-rf 没问题的朋友，很乐意帮忙:)

【解决方案2】：

是的，您可以使用 ES6 进行嵌套解构。 MDN gives you a nice example.

let node = {
  ItemTitle: 'Title',
  ItemId: 5,
  Menu: {
    Item: [{
      ItemId: 579
    }]
  }
}

let { Menu: { Item: [{ ItemId }] } } = node

console.log(ItemId) // 579

【讨论】：