使用对象数组解构对象

4

我有这样一个对象:

obj: {
  child1: [
    { type, checked, text, ... },
    { type, checked, text, ... },
    { type, checked, text, ... },
  ],
  child2: [
    { type, checked, text, ... },
    ...
  ],
  ...
}

我需要几乎相同的对象,但子元素应该只包含类型和选中值的对象。需要我的输出如下面的示例所示。 输出:
obj: {
  child1: [
    {
      type: "type",
      checked: "checked"
    },
    {
      type: "type",
      checked: "checked"
    },
    {
      type: "type",
      checked: "checked"
    }
  ],
  child2: [
    {
      type: "type",
      checked: "checked"
    }
  ]
}

目前为止,我尝试的所有方法似乎都不起作用。

我最后一次失败的尝试:

    Object.keys(tabs).forEach(key =>
      ({
        updatedState: {
          [key]: (({ documentTypeId, checked }) => ({ documentTypeId, checked }))(tabs[key]),
        },
      }),
    );

最终结果应该是什么(例如)? - Ori Drori
同一个对象。唯一的区别是子对象child1、child2等只应具有类型和选中值。 - Simas.B
你似乎在寻找map而不是forEach。你不想改变原来的对象,对吧?如果你想改变,那么你的代码中没有任何赋值操作! - Bergi
childN?这真的需要一个数组。 - Bergi
你正在遍历 tabs 的键,但你没有遍历 tabs[key] 数组。 - Bergi
2个回答

6
您可以使用 Array.reduce()对象的键 进行迭代,结合内部 Array.map()解构 创建您想要保留的属性的新对象:

const type = 'type'
const checked = 'checked'
const text = 'text'

const obj = {
  child1: [
    { type, checked, text },
    { type, checked, text },
    { type, checked, text },
  ],
  child2: [
    { type, checked, text },
  ],
}

const result = Object.keys(obj).reduce((r, k) => {
  r[k] = obj[k].map(({ type, checked }) => ({ type, checked }))
  
  return r
}, {})

console.log(result)


2

You can use a combination of reduce (to iterate through the object keys) and map (for your children arrays)

const obj = {
  child1: [
    { type: 1, checked: true, text: 'aaa'},
    { type: 2, checked: false, text: 'bbb'},
    { type: 3, checked: true, text: 'ccc'}
  ],
  child2: [
    { type: 4, checked: true, text: 'ddd'},
    { type: 5, checked: false, text: 'eee'},
    { type: 6, checked: true, text: 'fff'}
  ]
};

const result = Object.keys(obj).reduce((acc, key) => { 
  acc[key] = obj[key].map(child => 
    ({type: child.type, checked: child.checked}));
    
  return acc;
}, {}); 

console.log(result);


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接