合并两个数组并保留附加字段（数组对象之间的差异）

Question

我找不到一种干净的方法来合并两个数组并保留其他字段，即数组对象之间的区别。  const currentForm = [    {      name: "username",      type: "string",      info: "enter username",      value: "test"    },    {      name: "password",      type: "aes",      info: "enter password",      value: "pass"    }  ];  const newForm = [    {      name: "username",      type: "string",      info: "enter username"    }  ];合并后我想要这个数组：  const currentForm = [    {      name: "username",      type: "string",      info: "enter username",      value: "test"    }  ];我用一个复杂的函数实现了这个，但我认为它可以用 es6 语法轻松实现。工作示例：https ://codesandbox.io/s/merged-arrays-18m1t?file=/src/App.js

Answer 1

我不清楚你想要达到什么目的。

如果要将第一个数组的每个对象与另一个数组中相同位置的对象合并：

currentForm.map((obj, i) => Object.assign({}, obj, newForm[i]));

Answer 2

如果name是每个对象的唯一键，我们可以执行以下操作。

• 首先，我们用array.map()合并所有同名的字段 。

  • 我们使用array.find在另一个数组中获取相同的字段。

  • 我们使用析构合并两个对象

• 然后我们用Array.filter()过滤掉我们不再拥有的字段

  • 要查看对象是否存在于新数组中，我们使用array.some()返回一个布尔值作为结果，我们可以将其传回 filter 方法。

const currentForm = [

  {

    name: "username",

    type: "string",

    info: "enter username",

    value: "test"

  },

  {

    name: "password",

    type: "aes",

    info: "enter password",

    value: "pass"

  }

];

const newForm = [

  {

    name: "username",

    type: "string",

    info: "enter username"

  }

];

const mergeForms = (firstForm, secondForm) => {

  // Merge all fields

  const mergedFields = firstForm.map((obj) => ({...obj, ...secondForm.find(({ name }) => obj.name === name)}));

  // Filter out fields we no longer have

  const fieldsToKeep = mergedFields.filter((obj) => newForm.some(({ name }) => obj.name === name));

  // Return fields

  return fieldsToKeep;

};

// Merge 2 forms

const mergedForm = mergeForms(currentForm, newForm);

console.log(mergedForm);