将键移动到子数组js [关闭]答案

【问题标题】：move key to sub array js [closed]将键移动到子数组js [关闭]
【发布时间】：2019-05-15 16:15:15
【问题描述】：

我有一个按名称分组的对象数组，如下所示：

[
  {
    Name: 'Color',
    Data:[{Id: 1, Name: 'Red'},
          {Id: 2, Name: 'Yellow'},
          {Id: 3, Name: 'Blue'},
          {Id: 4, Name: 'Green'},
          {Id: 7, Name: 'Black'}]
  }, {
    Name: 'Size',
    Data:[{Id: 8, Name: 'S'},
          {Id: 11, Name: 'M'},
          {Id: 12, Name: 'L'},
          {Id: 13, Name: 'XL'},
          {Id: 14, Name: 'XXL'}]
  }
]

我想把它转换成这样的重数组：

[
  {Id: 1, Name: 'Red', optionName: 'Color'}, 
  {Id: 2, Name: 'Yellow', optionName: 'Color'},
  {Id: 3, Name: 'Blue', optionName: 'Color'},
  {Id: 4, Name: 'Green', optionName: 'Color'},
  {Id: 7, Name: 'Black', optionName: 'Color'},
  {Id: 8, Name: 'S', optionName: 'Size'},
  {Id: 11, Name: 'M', optionName: 'Size'},
  {Id: 12, Name: 'L', optionName: 'Size'},
  {Id: 13, Name: 'XL', optionName: 'Size'},
  {Id: 14, Name: 'XXL', optionName: 'Size'}
]

如何在 javascript/ES6 中做到这一点？

【问题讨论】：

发布的问题似乎根本没有包含any attempt 来解决问题。 StackOverflow 期待您 try to solve your own problem first，因为您的尝试有助于我们更好地了解您想要什么。请编辑问题以显示您尝试过的内容，以说明您遇到minimal reproducible example 的特定障碍。欲了解更多信息，请参阅How to Ask 并拨打tour。

标签： javascript arrays ecmascript-6

【解决方案1】：

您也可以使用forEach 来执行此操作。如下所示。

var s = [{Name:'Color',Data:[{Id:1,Name:'Red'},{Id:2,Name:'Yellow'},{Id:3,Name:'Blue'},{Id:4,Name:'Green'},{Id:7,Name:'Black'}]},{Name:'Size',Data:[{Id:8,Name:'S'},{Id:11,Name:'M'},{Id:12,Name:'L'},{Id:13,Name:'XL'},{Id:14,Name:'XXL'}]}];

var y=[];

s.forEach(x=>x.Data.forEach(z=>{
  z['optionName'] = x.Name;
  y.push(z);
}));

console.log(y);

【讨论】：

【解决方案2】：

您可以将array#reduce 与array#forEach 一起使用。

const data = [ { Name: 'Color', Data:[{Id: 1, Name: 'Red'}, {Id: 2, Name: 'Yellow'}, {Id: 3, Name: 'Blue'}, {Id: 4, Name: 'Green'}, {Id: 7, Name: 'Black'}] }, { Name: 'Size', Data:[{Id: 8, Name: 'S'}, {Id: 11, Name: 'M'}, {Id: 12, Name: 'L'}, {Id: 13,Name: 'XL'}, {Id: 14, Name: 'XXL'}] } ],
      result = data.reduce((r, {Name: optionName,Data}) => {
        Data.forEach(({Id, Name}) => r.push({Id,Name, optionName}));
        return r;
      }, []);
console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

【讨论】：

【解决方案3】：

您可以使用.map()、.concat() 和Object.assign() 方法获取结果数组：

let data = [
  {Name: 'Color', Data:[{Id: 1, Name: 'Red'}, {Id: 2, Name: 'Yellow'}, {Id: 3, Name: 'Blue'}, {Id: 4, Name: 'Green'}, {Id: 7, Name: 'Black'}]},
  {Name: 'Size', Data:[{Id: 8, Name: 'S'}, {Id: 11, Name: 'M'}, {Id: 12, Name: 'L'}, {Id: 13, Name: 'XL'}, {Id: 14, Name: 'XXL'}]}
];

let result = [].concat(
  ...data.map(({Name, Data}) => Data.map(o => Object.assign({}, o, {optionName: Name})))
);

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

【讨论】：