我有两个json对象 obj1 和 obj2，我想合并它们并生成一个 json 对象。生成的 json 应该包含 obj2 中的所有值和 obj1 中不存在于 obj2 中的值。
Question:
var obj1 = {
"name":"manu",
"age":23,
"occupation":"SE"
}
var obj2 = {
"name":"manu",
"age":23,
"country":"india"
}
Expected:
var result = {
"name":"manu",
"age":23,
"occupation":"SE",
"country":"india"
}
有几种不同的解决方案可以实现这一点：
1 - 原生 javascript for-in 循环：
const result = {};
let key;
for (key in obj1) {
if(obj1.hasOwnProperty(key)){
result[key] = obj1[key];
}
}
for (key in obj2) {
if(obj2.hasOwnProperty(key)){
result[key] = obj2[key];
}
}
2 -Object.keys()：
const result = {};
Object.keys(obj1)
.forEach(key => result[key] = obj1[key]);
Object.keys(obj2)
.forEach(key => result[key] = obj2[key]);
3 -Object.assign() :
(浏览器兼容性：Chrome: 45, Firefox (Gecko): 34, Internet Explorer: 不支持, Edge: (Yes), Opera: 32, Safari: 9)
const result = Object.assign({}, obj1, obj2);
4 -扩展运算符：
从ECMAScript 2015（第 6 版，ECMA-262）标准化：
在规范的几个部分中定义：Array Initializer，Argument Lists
使用这种新语法，您可以将不同的对象加入/合并为一个对象，如下所示：
const result = {
...obj1,
...obj2,
};
5 -jQuery.extend(target, obj1, obj2)：
将两个或多个对象的内容合并到第一个对象中。
const target = {};
$.extend(target, obj1, obj2);
6 -jQuery.extend(true, target, obj1, obj2)：
将两个或多个对象的内容深度合并到目标中。false不支持传递第一个参数。
const target = {};
$.extend(true, target, obj1, obj2);
7 - Lodash_.assignIn(object, [sources])：也称为_.extend：
const result = {};
_.assignIn(result, obj1, obj2);
8 -洛达什_.merge(object, [sources])：
const result = _.merge(obj1, obj2);
lodash 的合并函数和 之间有几个重要的区别Object.assign：
1- 虽然它们都接收任意数量的对象，但 lodash 的合并应用了这些对象的深度合并，但Object.assign只合并了第一级。例如：
_.isEqual(_.merge({
x: {
y: { key1: 'value1' },
},
}, {
x: {
y: { key2: 'value2' },
},
}), {
x: {
y: {
key1: 'value1',
key2: 'value2',
},
},
}); // true
但：
const result = Object.assign({
x: {
y: { key1: 'value1' },
},
}, {
x: {
y: { key2: 'value2' },
},
});
_.isEqual(result, {
x: {
y: {
key1: 'value1',
key2: 'value2',
},
},
}); // false
// AND
_.isEqual(result, {
x: {
y: {
key2: 'value2',
},
},
}); // true
2-另一个区别与如何Object.assign和_.merge解释undefinedvalue有关：
_.isEqual(_.merge({x: 1}, {x: undefined}), { x: 1 }) // false
但：
_.isEqual(Object.assign({x: 1}, {x: undefined}), { x: undefined })// true
更新 1：
for in在 JavaScript 中使用循环时，我们应该特别注意我们的环境，特别是 JavaScript 类型中可能发生的原型变化。比如一些上了年纪的JavaScript库中添加新的东西Array.prototype，甚至Object.prototype。为了保护您的迭代免受添加的东西的影响，我们可以object.hasOwnProperty(key)用来确保键实际上是您正在迭代的对象的一部分。
更新 2：
我更新了我的答案并添加了解决方案 4，这是一个新的 JavaScript 功能，但尚未完全标准化。我将它与Babeljs一起使用，Babeljs是用于编写下一代 JavaScript 的编译器。
更新 3：
我添加了Object.assign和之间的区别_.merge。
使用 Jquery 的最简单方法 -
var finalObj = $.extend(obj1, obj2);
没有 Jquery -
var finalobj={};
for(var _obj in obj1) finalobj[_obj ]=obj1[_obj];
for(var _obj in obj2) finalobj[_obj ]=obj2[_obj];
1)
var merged = {};
for(key in obj1)
merged[key] = obj1[key];
for(key in obj2)
merged[key] = obj2[key];
2)
var merged = {};
Object.keys(obj1).forEach(k => merged[k] = obj1[k]);
Object.keys(obj2).forEach(k => merged[k] = obj2[k]);
Object.keys(obj1)
.concat(Object.keys(obj2))
.forEach(k => merged[k] = k in obj2 ? obj2[k] : obj1[k]);
3）最简单的方法：
var merged = {};
Object.assign(merged, obj1, obj2);
另一个使用underscore.js 的解决方案：
_.extend({}, obj1, obj2);
我过去曾使用此函数来合并对象，我使用它来添加或更新现有属性的obj1值来自obj2：
var _mergeRecursive = function(obj1, obj2) {
//iterate over all the properties in the object which is being consumed
for (var p in obj2) {
// Property in destination object set; update its value.
if ( obj2.hasOwnProperty(p) && typeof obj1[p] !== "undefined" ) {
_mergeRecursive(obj1[p], obj2[p]);
} else {
//We don't have that level in the heirarchy so add it
obj1[p] = obj2[p];
}
}
}
它将处理多层次的层次结构以及单层次的对象。我将它用作操作 JSON 对象的实用程序库的一部分。你可以在这里找到它。