如何根据 属性 值合并两个数组以响应 ES6

How to merge two arrays based on the property value in react with ES6

我有两个数组:

 a = [{"sourceId": "1", "targetId": "2", "name": "heats air"} , 
      {"sourceId": "3", "targetId": "4", "name": "power"}]

 b = [{"name": "Hair Dryer", "id": "1"}, 
      {"name": "Heating System", "id": "2"}, 
      {"name": "Mains", "id": "3"}, 
      {"name": "Blower", "id": "4"}]

如何得到这样的输出:

[{"sourceId": "1", "targetId": "2", "name": "heats air", "from": "Hair Dryer", "to": "Heating System"}, 
 {"sourceId": "3", "targetId": "4", "name": "power","from": "Mains", "to": "Blower"]

我想根据属性值合并它们:数组a的键"sourceId"和"targetId"应该对应数组b的键"id"。如果一个sourceId匹配到一个id,则将key为"from"的name的值添加到数组a中的对象中;如果 targetId 与 id 匹配,则将具有键 "to" 的名称的值添加到数组 a 中的项目。另外,我想知道我是否可以在不使用 lodash 的情况下做到这一点。 (使用 ES6)

b转换为Map of id to name using Array#reduce. Then Array#map a to the required form using Object#assignbMap

const a = [{"sourceId":"1","targetId":"2","name":"heats air"},{"sourceId":"3","targetId":"4","name":"power"}];

const b = [{"name":"Hair Dryer","id":"1"},{"name":"Heating System","id":"2"},{"name":"Mains","id":"3"},{"name":"Blower","id":"4"}];

const bMap = b.reduce((map, item) => map.set(item.id, item.name), new Map);

const result = a.map((item) => (Object.assign({
  from: bMap.get(item.sourceId),
  to: bMap.get(item.targetId)
}, item)));

console.log(result);

给你。

 const a = [{"sourceId": "1", "targetId": "2", "name": "heats air"} , 
      {"sourceId": "3", "targetId": "4", "name": "power"}]

 const b = [{"name": "Hair Dryer", "id": "1"}, 
      {"name": "Heating System", "id": "2"}, 
      {"name": "Mains", "id": "3"}, 
      {"name": "Blower", "id": "4"}]
      
 const result = a.reduce((arr, curr) => {
  const from = b.filter(bObj => {
   return bObj.id === curr.sourceId;
  })[0]
  const to = b.filter(bObj => {
   return bObj.id === curr.targetId;
  })[0];
  arr.push({ ...curr, from: from.name, to: to.name });
  return arr;
 }, []);
 
 console.log(result);