合并对象数组

Beginner

This tutorial is from open-source community. Access the source code

简介

在这个实验中,我们将进行一个 JavaScript 编程练习,目标是根据指定属性合并两个对象数组。这个练习的目的是帮助你练习使用 JavaScript 中的 Array.prototype.reduce() 方法和对象操作,这对于任何使用 JavaScript 的开发者来说都是必不可少的技能。在这个实验结束时,你应该能够根据一个属性无缝合并两个对象数组以创建一个新数组。

基于指定键合并对象数组的函数

要基于特定键合并两个对象数组,请按以下步骤操作:

  1. 打开终端/SSH 并输入 node 以开始练习编码。
  2. 使用 Array.prototype.reduce() 和一个对象累加器,根据给定的 prop 合并两个数组中的所有对象。
  3. 使用 Object.values() 将结果对象转换为数组并返回。

以下是你可以使用的函数:

const combine = (a, b, prop) =>
  Object.values(
    [...a, ...b].reduce((acc, v) => {
      if (v[prop])
        acc[v[prop]] = acc[v[prop]] ? { ...acc[v[prop]], ...v } : { ...v };
      return acc;
    }, {})
  );

以下是如何使用此函数的示例:

const x = [
  { id: 1, name: "John" },
  { id: 2, name: "Maria" }
];
const y = [{ id: 1, age: 28 }, { id: 3, age: 26 }, { age: 3 }];
combine(x, y, "id");
// [
//  { id: 1, name: 'John', age: 28 },
//  { id: 2, name: 'Maria' },
//  { id: 3, age: 26 }
// ]

总结

恭喜你!你已经完成了“合并对象数组”实验。你可以在 LabEx 中练习更多实验来提升你的技能。