解构数组中的嵌套对象答案

【问题标题】：Destructuring nested objects in an array解构数组中的嵌套对象
【发布时间】：2019-10-07 16:43:40
【问题描述】：

我基本上想提取数组中的第一个对象并获取它的名称。这里唯一的挑战是我试图在父对象中解构它：

const exampleObject = {
  collection: [{
    name: "First Object",
  }, {
    name: "Second Object",
  }],
};

const {
  collection: [firstObject: {
    name
  }]
} = exampleObject;

console.log(firstObject);

有可能吗？

【问题讨论】：

你想要的输出是什么？
这是对ES6: Destructuring — an elegant way of extracting data from arrays and objects in JavaScript的一个很好的阅读

标签： javascript ecmascript-6 destructuring

【解决方案1】：

你需要切换到：

{name: firstObject}
  |        |________ New variable name
  |    
  |_________________ Property name

const exampleObject = {collection: [{name: "First Object",}, {name: "Second Object",}],}

const { collection: [{ name: firstObject }] } = exampleObject

console.log(firstObject)

【讨论】：

哦，好吧，原来我想我是通过给它命名firstObject来提取数组对象。我几乎不知道我需要做的就是这样的事情：[ { name }]。对吗？
@CarlEdwards 如果你不想重命名它[{name}] 是enoguh
@Carl - 这两者都是可能的，因为解构语法 mirrors 对象和数组字面量语法。在对象字面量语法中，{name: x} 创建了一个名为name 的属性，并将其从 x 获取的值赋予它。在解构语法中，{name: x} 将值 from name 放入 in x。也就是说，文字语法中值的来源是解构语法中值的目标。一旦你知道，既然你已经熟悉文字语法，解构就变成了……好吧，我不会撒谎，它不会成为第二天性。但它变得更容易了。
完美。谢谢。会在少数人中接受这个答案。也许我的记忆力下降了，但我认为那些超过一定业力的人可以立即接受。也许这是新事物。 _(ツ)_/¯
@CarlEdwards - 我认为延迟适用于所有人。 15分钟并不长。 :-)

【解决方案2】：

如果你需要第一个对象的名字，你应该写

const {
  collection: [{ name }]
} = exampleObject;

console.log(name);

【讨论】：