如何根据属性值合并两个数组以与ES6反应答案

【问题标题】：How to merge two arrays based on the property value in react with ES6如何根据属性值合并两个数组以与ES6反应
【发布时间】：2018-02-10 17:23:10
【问题描述】：

我有两个数组：

 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 匹配，则将键为“from”的名称的值添加到数组 a 中的对象中；如果 targetId 与 id 匹配，则将带有键“to”的名称的值添加到数组 a 中的项目。另外，我想知道我是否可以在不使用 lodash 的情况下做到这一点。（使用 ES6）

【问题讨论】：

不清楚合并算法应该是什么，因为被合并的对象没有共同的属性。你如何确定什么与什么合并？请“用文字”描述合并算法是什么。而且，您如何确定应该将from 和to 设置为什么？
数组a的“sourceId”和“targetId”键对应数组b的“id”键
请编辑您的问题以将合并算法添加到您的问题中。还要描述应该如何设置from 和to。评论不应用于所需信息 - 应将信息添加到问题本身。

标签： arrays reactjs ecmascript-6 array-merge

【解决方案1】：

使用Array#reduce 将b 转换为id 到name 的Map。然后将Array#mapa 使用Object#assign 和bMap 转换为所需的表格：

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);

【讨论】：

【解决方案2】：

给你。

 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);

【讨论】：