使用传播算子深度合并对象

Posted 2021-04-11

我可以像这样合并多个对象：

  var a = {k:{i:1, j:2}, m:6}
  var b = {k:{i:3, l:4}}
  var c = {
    ...a,
    ...b
  }

c的m:6不错；但是，c不包含k.j:2。这是因为...b进行了浅覆盖。

我想递归使用...，以使不在b中的嵌套属性不会被覆盖。

我喜欢...，因为它看上去是如此快速干净。我可以在c的对象初始值设定项中这样做吗？

---

更新

我到目前为止已经很近了，但是似乎有点冗长：

  var merge = (a,b) => Object.assign(a, ...Object.keys(b).map(k => ({[k]: typeof b[k] === 'object' ? merge(a[k], b[k]) : b[k]})))
  var a = {k:{i:1, j:2}, m:6}
  var b = {k:{i:3, l:4}}
  var c = merge(a,b)

答案

使用...无法做到。如果您事先知道对象的形状，尽管可以这样写：

  var a = {k:{i:1, j:2}, m:6}
  var b = {k:{i:3, l:4}}
  var c = {
    ...a,
    ...b,
    k: { ...a.k, ...b.k },
  }

否则，您需要编写一个函数来执行此操作或搜索一个函数：https://www.npmjs.com/search?q=merge+deep