合并并连接两个对象数组 - JS

时间:2021-01-20 19:00:23

标签: javascript arrays lodash

我有两个对象数组,我想根据不同的属性合并它们,如果列表中不存在某些内容,还想合并。

这就是我所拥有的:

const data1 = [{
  name: 'A',
  id: 1
}, {
  name: 'B',
  id: 2
}]

const data2 = [{
  city: 'X',
  rowID: 1
}, {
  city: 'Y',
  rowID: 2
}, {
  city: 'Z',
  rowID: 3
}]

const result = _.map(data1, function(p) {
  return _.merge(
    p,
    _.find(data2, {
      rowID: p.id
    })
  )
})

console.log(result)

//Expected Result
/**[
  {
    "name": "A",
    "id": 1,
    "city": "X",
    "rowID": 1
  },
  {
    "name": "B",
    "id": 2,
    "city": "Y",
    "rowID": 2
  },
  {
    "name": "",
    "id": "",
    "city": 'Z',
    "rowID": 3
  }
]*/
<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.20/lodash.min.js"></script>

请指教。

2 个答案:

答案 0 :(得分:2)

您可以使用 Map 收集合并对象并获取值。

const
    merge = data => {
        const
            pattern = {},
            map = new Map;

        data.forEach(([objects, key]) => {
            Object.keys(objects[0]).forEach(k => pattern[k] = '');
            objects.forEach(o => map.set(o[key], { ...map.get(o[key]), ...o }));
        });
        return Array.from(map.values(), o => ({ ...pattern, ...o }));
    },
    data1 = [{ name: 'A', id: 1 }, { name: 'B', id: 2 }],
    data2 = [{ city: 'X', rowID: 1 }, { city: 'Y', rowID: 2 }, { city: 'Z', rowID: 3 }],
    result = merge([[data1, 'id'], [data2, 'rwoID']]);

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

答案 1 :(得分:1)

连接数组,按idrowId对它们进行分组,合并所有对象并将值映射到空字符串,映射组的对象,并将每个组与默认值合并为一个对象(包括默认的空 idname)。

const { concat, groupBy, mapValues, map, merge } = _

const fn = (getId, ...arrs) => {
  const items = concat(...arrs);
  const defaults = mapValues(merge({}, ...items), () => '');

  return map(
    groupBy(items, getId),
    group => merge({}, defaults, ...group)
  )
}

const data1 = [{"name":"A","id":1},{"name":"B","id":2}]

const data2 = [{"city":"X","rowID":1},{"city":"Y","rowID":2},{"city":"Z","rowID":3}]

const result = fn(o => o.id ?? o.rowID, data1, data2)

console.log(result)
<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.20/lodash.min.js"></script>

相关问题