组合对象以获得一个对象数组

Question

有一个数组开始

 [
    {
      response: {
        'bab6ffa8-e42e-4daa-a26c-65328503bffc': {
          foo: 'Hello',
          bar: 'World'
        },
        'f1230cf3-9970-4b20-a928-a33c1754620c': {
          foo: 'Hello',
          bar: 'Bye',
          foobar: false
        }
      }
    },
    {
      response: {
          'bab6ffa8-e42e-4daa-a26c-65328503bffc': {
            prod: false
          },
          'f1230cf3-9970-4b20-a928-a33c1754620c': {
            date: 1574462751400
          },
          '3825f180-14ea-4c77-8369-db826751424e': {
            bar: 1.522,
            date: 1574406051700
          }
      }
    }
  ];

嗯，我正在尝试构建看起来像这样的数组

  [
    {
      id: 'bab6ffa8-e42e-4daa-a26c-65328503bffc',
      fooValue: 'Hello',
      barValue: 'World',
      foobarValue: undefined,
      prodState: false,
      dateNow: undefined
    },
    {
      id: 'f1230cf3-9970-4b20-a928-a33c1754620c',
      fooValue: 'Hello',
      barValue: 'Bye',
      foobarValue: false,
      prodState: undefined,
      dateNow: 1574462751400
    },
    {
      id: '3825f180-14ea-4c77-8369-db826751424e',
      fooValue: undefined,
      barValue: 1.522,
      foobarValue: undefined,
      prodState: undefined,
      dateNow: 1574406051700,
    }
  ]

我开始编码了

  const result = array.map(obj => obj.response);

  console.log('result', result);

但这就是我目前得到的全部，朋友说我可以尝试使用reduce 和更多map，不知道如何实现，他也没有真正解释，所以这就是我在这里的原因。

我只是不想使用 for 循环，它们丑陋且难以阅读。

Answer 1

您可以使用 reduce 方法遍历您的数组，并使用 for in 遍历对象的键以添加必要的键及其值：

let arr = [
   {
     response: {
       'bab6ffa8-e42e-4daa-a26c-65328503bffc': {
         foo: 'Hello', bar: 'World'
       },
       'f1230cf3-9970-4b20-a928-a33c1754620c': {
         foo: 'Hello', bar: 'Bye', foobar: false
       }
     }
   },
   {
     response: {
         'bab6ffa8-e42e-4daa-a26c-65328503bffc': {
           prod: false
         },
         'f1230cf3-9970-4b20-a928-a33c1754620c': {
           date: 1574462751400
         },
         '3825f180-14ea-4c77-8369-db826751424e': {
           bar: 1.522, date: 1574406051700
         }
     }
   }
 ];    

 const result = arr.reduce((a,c) => {
    for (const key in c.response) {
      a[key] = a[key] || { id: key, bar: c.response[key].bar };
      for (const respKey in c.response[key]) {
         a[key][respKey] = c.response[key][respKey];
      }
    }

    return a;
 }, {})

 console.log(Object.values(result));

更新 1：

如果要显式添加键，只需将它们添加到此表达式中：

a[key] = a[key] || { id: key, bar: c.response[key].bar, 
    foobarValue: c.response[key].foobarValue };

让我举个例子：

let arr = [
   {
 response: {
   'bab6ffa8-e42e-4daa-a26c-65328503bffc': {
     foo: 'Hello', bar: 'World'
   },
   'f1230cf3-9970-4b20-a928-a33c1754620c': {
     foo: 'Hello', bar: 'Bye', foobar: false
   }
 }
   },
   {
 response: {
     'bab6ffa8-e42e-4daa-a26c-65328503bffc': {
       prod: false
     },
     'f1230cf3-9970-4b20-a928-a33c1754620c': {
       date: 1574462751400
     },
     '3825f180-14ea-4c77-8369-db826751424e': {
       bar: 1.522, date: 1574406051700
     }
 }
   }
 ];

 const result = arr.reduce((a,c) => {
for (const key in c.response) {
  a[key] = a[key] || { id: key, bar: c.response[key].bar, foobarValue: c.response[key].foobarValue };
  for (const respKey in c.response[key]) {
        a[key][respKey] = c.response[key][respKey];
  }
}

return a;
 }, {})

 console.log(Object.values(result));

Answer 2

const list = [
   {
     response: {
       'bab6ffa8-e42e-4daa-a26c-65328503bffc': {
         foo: 'Hello', bar: 'World'
       },
       'f1230cf3-9970-4b20-a928-a33c1754620c': {
         foo: 'Hello', bar: 'Bye', foobar: false
       }
     }
   },
   {
     response: {
         'bab6ffa8-e42e-4daa-a26c-65328503bffc': {
           prod: false
         },
         'f1230cf3-9970-4b20-a928-a33c1754620c': {
           date: 1574462751400
         },
         '3825f180-14ea-4c77-8369-db826751424e': {
           bar: 1.522, date: 1574406051700
         }
     }
   }
 ];    

var mapping = {'foo': 'fooValue', 'bar': 'barValue', 'foobar': 'foobarValue', 'prod': 'prodState', 'date': 'dateNow'};
var result = Object.values(list.reduce((acc, {response}) => {
	for(let [key, value ] of (Object.entries(response))) {
		if(!acc.hasOwnProperty(key)) {
			acc[key] = {id: key};
		}
		
		for(let [keyName, valueName] of (Object.entries(mapping))) {
		  if(acc[key][valueName] == undefined){
			 acc[key][valueName] = value[keyName]
		  }
		}
	}
    return acc;
 }, {}));
console.log(result);