javascript - 合并 JS 对象而不覆盖

Question

假设您有两个对象:

var foo = {
    a : 1,
    b : 2
};

var bar = {
    a : 3,
    b : 4
}

合并它们(并允许深度合并)以创建此内容的最佳方式是什么:

var foobar = {
    a : [1, 3],
    b : [2, 4]
}

为澄清问题而编辑:理想情况下，如果一个属性存在而不是另一个存在，我希望仍会创建一个数组，用于规范化目的并允许进一步减少的 map ，但是我在下面看到的答案绰绰有余。出于本练习的目的，我只是在寻找字符串或数字合并，所以我没有考虑所有可能的情况。不过，如果你拿枪指着我的头让我做出选择，我会说默认为数组。

感谢大家的贡献。

Answer 1

这应该可以满足您的需求。它会递归地将任意深度的对象合并到数组中。

// deepmerge by Zachary Murray (dremelofdeath) CC-BY-SA 3.0
function deepmerge(foo, bar) {
  var merged = {};
  for (var each in bar) {
    if (foo.hasOwnProperty(each) && bar.hasOwnProperty(each)) {
      if (typeof(foo[each]) == "object" && typeof(bar[each]) == "object") {
        merged[each] = deepmerge(foo[each], bar[each]);
      } else {
        merged[each] = [foo[each], bar[each]];
      }
    } else if(bar.hasOwnProperty(each)) {
      merged[each] = bar[each];
    }
  }
  for (var each in foo) {
    if (!(each in bar) && foo.hasOwnProperty(each)) {
      merged[each] = foo[each];
    }
  }
  return merged;
}

这一个将做同样的事情，除了合并的对象将包括继承属性的副本。这可能不是您要找的(根据 RobG 在下面的评论)，但如果这确实是您要找的，那么这里就是:

// deepmerge_inh by Zachary Murray (dremelofdeath) CC-BY-SA 3.0
function deepmerge_inh(foo, bar) {
  var merged = {};
  for (var each in bar) {
    if (each in foo) {
      if (typeof(foo[each]) == "object" && typeof(bar[each]) == "object") {
        merged[each] = deepmerge(foo[each], bar[each]);
      } else {
        merged[each] = [foo[each], bar[each]];
      }
    } else {
      merged[each] = bar[each];
    }
  }
  for (var each in foo) {
    if (!(each in bar)) {
      merged[each] = foo[each];
    }
  }
  return merged;
}

我用你在 http://jsconsole.com 上的例子试过了，而且效果很好:

deepmerge(foo, bar)
{"a": [1, 3], "b": [2, 4]}
bar
{"a": 3, "b": 4}
foo
{"a": 1, "b": 2}

稍微复杂一点的对象也能正常工作:

deepmerge(as, po)
{"a": ["asdf", "poui"], "b": 4, "c": {"q": [1, 444], "w": [function () {return 5;}, function () {return 1123;}]}, "o": {"b": {"t": "cats"}, "q": 7}, "p": 764}
po
{"a": "poui", "c": {"q": 444, "w": function () {return 1123;}}, "o": {"b": {"t": "cats"}, "q": 7}, "p": 764}
as
{"a": "asdf", "b": 4, "c": {"q": 1, "w": function () {return 5;}}}