繁体   English   中英

如何根据javascript中的键合并和替换两个数组中的对象?

[英]How to merge and replace objects from two arrays based on a key in javascript?

我有两个数组对象(arrayList1,arrayList2)。 只是我试图将这两个数组合并为一个数组对象。 我使用了以下术语。

  • 两个数组基于键名合并为一个数组是type
  • arrayList2 值将覆盖 arrayList1。
  • 我得到了预期的输出,但我担心以高效和性能的方式做..

有人可以简化我的代码..

笔记 :

  • 如果使用 Array.reduce 函数而不使用任何插件/库,那就太好了。
  • 我添加了 smaple 输入以供理解。 元素顺序将改变,两个数组的大小也将改变。

 const arrayList1 = [ { type: "A", any: 11, other: "ab", props: "1" }, { type: "B", any: 22, other: "bc", props: "2" }, // same type { type: "C", any: 33, other: "df", props: "3" } ]; const arrayList2 = [ { type: "D", any: 44, other: "aa", props: "11" }, { type: "B", any: 22, other: "bb", props: "2----2" , x: 10}, // same type { type: "E", any: 44, other: "cc", props: "33" } ]; result = arrayList2.reduce(function (arr1, arr2) { let isMatchFound = false; arr1.forEach(function (list) { if (arr2.type == list.type) { list = Object.assign(list, arr2); isMatchFound = true; } }); if (!isMatchFound) { arr1.push(arr2); } return arr1; }, arrayList1); console.log('result', JSON.stringify(result));

您还可以使用Object.values() .reduce()Object.values()方法来获取所需的输出:

 const arrayList1 = [ { type: "A", any: 11, other: "ab", props: "1" }, { type: "B", any: 22, other: "bc", props: "2" }, // same type { type: "C", any: 33, other: "df", props: "3" } ]; const arrayList2 = [ { type: "D", any: 44, other: "aa", props: "11" }, { type: "B", any: 22, other: "bb", props: "2----2" , x: 10}, // same type { type: "E", any: 44, other: "cc", props: "33" } ]; const result = Object.values( [].concat(arrayList1, arrayList2) .reduce((r, c) => (r[c.type] = Object.assign((r[c.type] || {}), c), r), {}) ); console.log(result); 
 .as-console-wrapper { max-height: 100% !important; top: 0; } 

你可以使用reduceObject.values做这样的事情

 const array1 = [ { type: "A", any: 11, other: "ab", props: "1" }, { type: "B", any: 22, other: "bc", props: "2" }, // same type { type: "C", any: 33, other: "df", props: "3" } ]; const array2 = [ { type: "D", any: 44, other: "aa", props: "11" }, { type: "B", any: 22, other: "bb", props: "2----2" , x: 10}, // same type { type: "E", any: 44, other: "cc", props: "33" } ]; const mapped = array1.reduce((a,t)=> (a[t.type] = t, a), {}), mapped2 = array2.reduce((a,t)=> (a[t.type] = t, a), {}) console.log(Object.values({...mapped, ...mapped2})) 

如果你只是想让你的代码更小:

 const arrayList1 = [ { type: "A", any: 11, other: "ab", props: "1" }, { type: "B", any: 22, other: "bc", props: "2" }, // same type { type: "C", any: 33, other: "df", props: "3" } ]; const arrayList2 = [ { type: "D", any: 44, other: "aa", props: "11" }, { type: "B", any: 22, other: "bb", props: "2----2" , x: 10}, // same type { type: "E", any: 44, other: "cc", props: "33" } ]; result = arrayList2.reduce(function(arr1, arr2) { if (arr1.find(({ type }) => type == arr2.type)) { arr1[arr1.indexOf(arr1.find(({ type }) => type == arr2.type))] = Object.assign(arr1.find(({ type }) => type == arr2.type), arr2); arr1.push(arr2); } return arr1; }, arrayList1); console.log('result', JSON.stringify(result)); 

如果你在arrayList2之前不需要arrayList1,你可以使用这个简单的方法。 我所做的是我已经对所有元素arrayList2进行了解构,并且只对arrayList1中那些在arrayList1中不存在键的元素进行了解构。

PS reduce的问题是你必须减少最大的数组,否则你会错过更大数组的元素。

 const arrayList1 = [ { type: "A", any: 11, other: "ab", props: "1" }, { type: "B", any: 22, other: "bc", props: "2" }, // same type { type: "C", any: 33, other: "df", props: "3" } ]; const arrayList2 = [ { type: "D", any: 44, other: "aa", props: "11" }, { type: "B", any: 22, other: "bb", props: "2----2" , x: 10}, // same type { type: "E", any: 44, other: "cc", props: "33" } ]; const output = [...arrayList2, ...arrayList1.filter(el1 => !arrayList2.some(el2 => el2.type === el1.type))] //[].concat(arrayList2, arrayList1.filter(el1 => !arrayList2.some(el2 => el2.type === el1.type))) console.log(output) 

如果不需要使用reduce函数,则可以使用filter方法来实现所需的结果

 const arrayList1 = [ { type: 'A', any: 11, other: 'ab', props: '1' }, { type: 'B', any: 22, other: 'bc', props: '2' }, { type: 'C', any: 33, other: 'df', props: '3' } ]; const arrayList2 = [ { type: 'D', any: 44, other: 'aa', props: '11' }, { type: 'B', any: 22, other: 'bb', props: '2----2' , x: 10}, { type: 'E', any: 44, other: 'cc', props: '33' } ]; // make a copy of arrayList1 so original list is not modified const list1Copy = arrayList1.slice(); let exists; const temp = arrayList2.filter((list2Item, index) => { exists = false; list1Copy.forEach(list1Item => { if(list2Item.type === list1Item.type) exists = true; }); if(exists) list1Copy[index] = list2Item; return !exists; }); result = list1Copy.concat(temp); console.log(JSON.stringify(result)); 
 .as-console-wrapper { max-height: 100% !important; top: 0; } 

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM