具有一个排除的扩展运算符以合并对象

Question

我正在合并来自基于公共属性 URL 和 url 的两个对象数组的数据，并且我正在使用扩展运算符将所有属性添加到最终数组。

问题是，如果公共属性 value 没有相同的 key 名称，它将添加属性的“两次”，而不是更改属性名称或一个一个地添加属性是否有一种方法可以使用扩展运算符排除属性。

const data1 = [{
  url: 'google.com',
  private: 'no'
},{
  url: 'duckduckgo.com',
  private: 'yes'
}]


const data2 = [{
  URL: 'google.com',
  many: true,
  other: true,
  properties: true,
  dont: true,
  want: true,
  to: true,
  add: true,
  onebyone: true,
}]


const res = data2.map(obj => {
  const otherData = data1.find(({ url }) => url === obj.URL)

  return {
    ...obj,
    ...otherData
  }
})

console.log(res)

.as-console-wrapper { max-height: 100% !important; top: 0; }

预期的结果是删除 'duplicate' URL 属性并且只有 url: google.com

Answer 1

正如 OP 在评论中指出的那样，

could you use my example and provide and anwser please

请在下面找到一个工作示例。我认为是self-explanatory；但是，如果有任何问题，请 post 并将根据需要进行解释。

const data1 = [{
  url: 'google.com',
  private: 'no'
},{
  url: 'duckduckgo.com',
  private: 'yes'
}]


const data2 = [{
  URL: 'google.com',
  many: true,
  other: true,
  properties: true,
  dont: true,
  want: true,
  to: true,
  add: true,
  onebyone: true,
}]


const res = data2.map(({ URL, ...rest }) => {
  const otherData = data1.find(({ url }) => url === URL)

  return {
    ...rest,
    ...otherData
  }
})

console.log(res)

.as-console-wrapper { max-height: 100% !important; top: 0; }

注意：我们 de-structure 而不是 obj 并访问 URL 和 rest。然后，在填充时我们只需跳过 URL 并仅保留 rest。就是这样。

Answer 2

那么，为什么不直接从结果中删除 URL 字段呢？

const res = data2.map(obj => {
  const otherData = data1.find(({ url }) => url === obj.URL)

  const result = {
    ...obj,
    ...otherData
  };
  delete result.URL;
  return result;
})

具有一个排除的扩展运算符以合并对象

Spread operator with one exclusion to merge objects

javascript

arrays

object