复杂解构：数组的第一个索引内的对象在另一个对象内答案

【问题标题】：Complex Destructuring: Object inside first index of Array that is inside another Object复杂解构：数组的第一个索引内的对象在另一个对象内
【发布时间】：2021-11-03 21:43:19
【问题描述】：

考虑这个“复杂”对象：

const obj = {
    nestedArray: [
        { stuff: "things" }
    ],
    nestedObj: {
        key1: "value1",
        key2: "value2"
    }
}

我正在寻找一种优雅的单行解决方案来从obj 解构key1、key2 和stuff。

我当前的解决方案看起来像这样并且工作正常：

const { nestedArray, nestedObj: { key1, key2 } } = obj
const { stuff } = nestedArray[0]

但我宁愿像这样在一行中完成：

const { array[0]: { stuff }, nestedObject: { key1, key2 } } = obj

但显然这行不通。有什么方法可以像我想要的那样在一行中做到这一点吗？还是我对 ES6 要求太多了？我很乐意接受“否”的答案，只要它提供了一个很好的解释说明为什么不这样做。

【问题讨论】：

标签： javascript ecmascript-6 destructuring

【解决方案1】：

虽然可能，但通过将stuff 列为其在嵌套数组中的位置，非常类似于如果您使用具有stuff 属性的对象声明数组：

const obj = {
    nestedArray: [
        { stuff: "things" }
    ],
    nestedObj: {
        key1: "value1",
        key2: "value2"
    }
};
const { nestedArray: [{ stuff }], nestedObj: { key1, key2 } } = obj;
console.log(stuff);

我不推荐它——这样的代码很难阅读。

【讨论】：

感谢您的警告。我不打算让这种解构变得比现在更复杂，否则我会更加注意保持它的可读性。这对我来说更像是一个学习练习，我可以设想其他不那么令人困惑的用例:)

【解决方案2】：

你非常接近，只需使用数组解构和对象解构来获得stuff：

const obj = {
    nestedArray: [
        { stuff: "things" }
    ],
    nestedObj: {
        key1: "value1",
        key2: "value2"
    }
}

const { nestedArray: [{ stuff }], nestedObj: { key1, key2 } } = obj

console.log({ stuff, key1, key2 })

【讨论】：

谢谢。我知道我错过了一些东西。如果nestedArray 里面有多个对象，这仍然有效吗？我每次都会得到索引 0 吗？假设数组中的另一个对象具有相同的键？
@PsiKai 是的。仅当 nestedArray 不可迭代或为空时，它才不起作用。
它只对索引为 0 的对象起作用，即使有多个对象。你只会得到 1 个stuff 值。
@Bergi 感谢您的警告，幸运的是我在 trycatch 块内进行了这种解构，因此任何问题都会触发错误状态。
数组解构是任意的，但对象解构不是，所以你不能有多个stuff变量。但是，您可以使用别名 [{ stuff: s1 }, { stuff: s2 }, ...]。但是，如果您到了这一点，解构可能不是要走的路，您应该使用Array.map() 来获取stuff 值的数组。