javascript - how to merge 4 arrays object using lodash

Question

I am looking for best ways of doing this.

exData1 = [
  { name: "b", data1: "aa" },
  { name: "c", data1: "ee" },
];
exData2 = [
  { name: "a", data2: "cc" },
  { name: "b", data2: "bb" },
];
exData3 = [
  { name: "a", data3: "ee" },
  { name: "c", data3: "eee" },
];
exData4 = [
  { name: "a", data4: "ff" },
  { name: "b", data4: "cc" },
];

The end result I want is an array of merge with lodash:

resultData = [{
    name: "b",
    data1: "aa",
    data2: "bb",
    data4: "cc",
  },
  {
    name: "c",
    data1: "ee",
    data3: "eee",
  },
  {
    name: "a",
    data2: "cc",
    data3: "eee",
    data4: "ff"
  },
];

How do I do it the most efficient/clean way using lodash? Thanks!

标签： javascriptarraysobjectmergelodash

Answer 1

No need for lodash!

function combine(items = []) {
  return Object.values(items.flat().reduce((a, c) => {
    a[c.name] = {...(a[c.name] || {}), ...c};
    return a;
  }, {}));
}

exData1 = [
  { name: "b", data1: "aa" },
  { name: "c", data1: "ee" },
];
exData2 = [
  { name: "a", data2: "cc" },
  { name: "b", data2: "bb" },
];
exData3 = [
  { name: "a", data3: "ee" },
  { name: "c", data3: "eee" },
];
exData4 = [
  { name: "a", data4: "ff" },
  { name: "b", data4: "cc" },
];

console.log(combine([exData1, exData2, exData3, exData4]));