解构对象数组以获取嵌套值 ES6答案

【问题标题】：Descontruct array of objects to get nested values ES6解构对象数组以获取嵌套值 ES6
【发布时间】：2019-07-17 07:47:14
【问题描述】：

我有一个对象数组，例如：

const array = [
{
  name: 'object1', 
  value: true, 
  parameters: [
   { name: 'inner1', value: true},
   { name: 'inner2', value: false},
 ]
},
{
  name: 'object2', 
  value: false,
}

];

我需要获取数组中每个对象的值。要获取我使用过的 object1 和 object2 值

const [{value: object1}, {value: object2}] = array;

如何获取 values 数组中的 parameters 对象？如何以正确的方式解构它？找不到正确的方法..

【问题讨论】：

标签： javascript arrays ecmascript-6 javascript-objects

【解决方案1】：

您必须使用 parameters: 并继续解构：

const array = [{
    name: 'object1',
    value: true,
    parameters: [{
        name: 'inner1',
        value: true
      },
      {
        name: 'inner2',
        value: false
      },
    ]
  },
  {
    name: 'object2',
    value: false,
  }
];

const [{ parameters: [
  { value: value1 },
  { value: value2 }
]}] = array;
console.log(value1, value2);

但这不是远程可读的 IMO。我更喜欢使用标准点/括号表示法来获取parameters 数组，并使用.map 来提取值：

const array = [{
    name: 'object1',
    value: true,
    parameters: [{
        name: 'inner1',
        value: true
      },
      {
        name: 'inner2',
        value: false
      },
    ]
  },
  {
    name: 'object2',
    value: false,
  }
];

const values = array[0].parameters.map(({ value }) => value);
console.log(values);

【讨论】：

但是您仍然需要对 values 执行解构，因为它是一个数组？
@Dan 如果 OP 真的想要 独立变量，当然，但这在 IMO 中很奇怪。也可以const [value1, value2] = array[0].parameters.map(...

【解决方案2】：

您可以使用Array#flatMap 并仅映射paramters 的值。

const
    array = [{ name: 'object1', value: true, parameters: [{ name: 'inner1', value: true }, { name: 'inner2', value: false }] }, { name: 'object2', value: false }],
    values = array.flatMap(({ parameters = []}) => parameters.map(({ value }) => value));

console.log(values);

【讨论】：

【解决方案3】：

解构必须遵循它正在解构的对象的形状。在这种情况下考虑它的一个好方法是复制对象本身，然后用变量名替换每个值以将该值分配给

// Object from which to deconstruct values
const myArray = [{
    name: 'object1', 
    value: true, 
    parameters: [
       { name: 'inner1', value: true},
       { name: 'inner2', value: false}]
    }];

// Deconstruction
const [{
    name: nameVar, 
    value: valueVar, 
    parameters: [
        { name: paramNameVar1, value: valueVar1},
        { name: paramNameVar2, value: valueVar2}]

     }] = myArray

当然，一旦你开始获得更复杂的对象，以这种方式解构可能会更费力、可读性更低且效率更低。

【讨论】：

问题是关于如何用嵌套值解构对象/散列。解构必须遵循它正在解构的对象的形状。 OP 已经获得顶级值，但无法获得嵌套数组中的值。考虑像这样解构的一个好方法是基本上复制对象本身，然后用您想要分配这些值的 var 名称替换这些值。
我的意思是在你的回答中解释它......你可以随时编辑它！