Question

我有一个工作函数，通过属性a1和a1合并两个对象数组。解决方案基于对一些类似问题的解答，但是我的要求是仅将属性保留在原始数组a1中。

如何调整此函数以返回仅包含第一个数组中的属性的对象数组？

这里是带有示例数据的JS小提琴。请注意，输出记录到控制台。另外请注意，该解决方案必须使用原始Javascript ES6。

const a1 = [
 {
    FirstName: "John",
    LastName: "Doe",
    Age: 33,
    Username: "jdoe"
  },
  {
    FirstName: "Mary",
    LastName: "Bloom",
    Age: 63,
    Username: "mbloom"
  },
  {
    FirstName: "Alex",
    LastName: "Arias",
    Age: 21,
    Username: "aarias"
  }
];

const a2 = [
 {
    FirstName: "Johnathan",
    LastName: "Doe",
    Age: 34,
    Username: "jdoe",
    Job: "Graphic Designer"
  },
  {
    FirstName: "Mary-Anne",
    LastName: "Bloom",
    Age: 64,
    Username: "mbloom",
    Job: "Investor"
  },
  {
    FirstName: "Alex",
    LastName: "Arias",
    Age: 22,
    Username: "aarias",
    Job: "Student"
  }
];

/**
   * Merge an array of objects by property
   * @param {array} a1 array 1 destination to be merged into
   * @param {array} a2 array 2 source to be merged, overwrites existing values in a1
   * @param {string} prop name of property to match for merge
   * TODO: Set properties that exist on a1 only otherwise ignore
   */
function mergeByProperty(a1, a2, prop) {

    let merged = [];

    for (let i = 0; i < a1.length; i++) {
      merged.push({
        ...a1[i],
        ...(a2.find((itmInner) => itmInner[prop] === a1[i][prop]))
      });
    }

    return merged;
}

let result = mergeByProperty(a1, a2, 'Username');
console.log(JSON.stringify(result));

// Output:
[{"FirstName":"Johnathan","LastName":"Doe","Age":34,"Username":"jdoe","Job":"Graphic Designer"},{"FirstName":"Mary-Anne","LastName":"Bloom","Age":64,"Username":"mbloom","Job":"Investor"},{"FirstName":"Alex","LastName":"Arias","Age":22,"Username":"aarias","Job":"Student"}]

// Desired output (no "Job" property because that does not exist in the first array of objects):
[{"FirstName":"Johnathan","LastName":"Doe","Age":34,"Username":"jdoe"},{"FirstName":"Mary-Anne","LastName":"Bloom","Age":64,"Username":"mbloom},{"FirstName":"Alex","LastName":"Arias","Age":22,"Username":"aarias"}]

Answer 1

您可以从第一个数组中获取键，然后从第二个数组中选择对应的<div id="destination"> <div class="list"> <p class="body" onmouseover="highlight(this)" onmouseleave="back(this)" onclick="select(this)">Body1</p> <p class="body" onmouseover="highlight(this)" onmouseleave="back(this)" onclick="select(this)">Body2</p> <p class="body" onmouseover="highlight(this)" onmouseleave="back(this)" onclick="select(this)">Body3</p> <p class="body" onmouseover="highlight(this)" onmouseleave="back(this)" onclick="select(this)">Body4</p> <p class="body" onmouseover="highlight(this)" onmouseleave="back(this)" onclick="select(this)">Body5</p> <p class="body" onmouseover="highlight(this)" onmouseleave="back(this)" onclick="select(this)">Body6</p> </div>对

key/value

Answer 2

您可以从username创建a2映射，然后只需在Array.map数组上a1和merge上使用自定义merge function仅在Array.reduce的键上使用a1，并从a2分配值：

const a1 = [ { FirstName: "John", LastName: "Doe", Age: 33, Username: "jdoe" }, { FirstName: "Mary", LastName: "Bloom", Age: 63, Username: "mbloom" }, { FirstName: "Alex", LastName: "Arias", Age: 21, Username: "aarias" } ];
const a2 = [ { FirstName: "Johnathan", LastName: "Doe", Age: 34, Username: "jdoe", Job: "Graphic Designer" }, { FirstName: "Mary-Anne", LastName: "Bloom", Age: 64, Username: "mbloom", Job: "Investor" }, { FirstName: "Alex", LastName: "Arias", Age: 22, Username: "aarias", Job: "Student" } ];

let obj = a2.reduce((r,c) => (r[c.Username] = c, r), {}) // username map

let merge = (a, b, props) => props.reduce((r,c) => (r[c] = b[c], r), a)

let result = a1.map(x => merge(x, obj[x.Username], Object.keys(x)))

console.log(result)

Answer 3

您可以执行以下操作：

const a1 = [
 {
    FirstName: "John",
    LastName: "Doe",
    Age: 33,
    Username: "jdoe"
  },
  {
    FirstName: "Mary",
    LastName: "Bloom",
    Age: 63,
    Username: "mbloom"
  },
  {
    FirstName: "Alex",
    LastName: "Arias",
    Age: 21,
    Username: "aarias"
  }
];

const a2 = [
 {
    FirstName: "Johnathan",
    LastName: "Doe",
    Age: 34,
    Username: "jdoe",
    Job: "Graphic Designer"
  },
  {
    FirstName: "Mary-Anne",
    LastName: "Bloom",
    Age: 64,
    Username: "mbloom",
    Job: "Investor"
  },
  {
    FirstName: "Alex",
    LastName: "Arias",
    Age: 22,
    Username: "aarias",
    Job: "Student"
  }
];

const result = a1.map((obj1, index) => {
  const obj2 = a2[index];
  if (obj2) {
    return Object.keys(obj1).reduce((acc, key) => {
      acc[key] = obj2[key];
      return acc;
    }, {});
  }
  return obj1;
}, []);

console.log(result);

如何合并对象数组仅将属性保留在第一个数组中

3 个答案: