如何在不使用JQUERY的情况下加入两个JavaScript对象 [英] How to join two JavaScript Objects, without using JQUERY

问题描述

我有两个 json 对象obj1和obj2，我想合并它们并创建一个单独的json对象。
结果json应该包含obj2中的所有值和obj1中obj2中不存在的值。

I have two json objects obj1 and obj2, i want to merge them and crete a single json object. The resultant json should have all the values from obj2 and the values from obj1 which is not present in 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"
}

推荐答案

有几种不同的解决方案可以达到这个目的：

There are couple of different solutions to achieve this:

1 - 本机javascript for-in循环：

var result = {};
for(var key in obj1) result[key] = obj1[key];
for(var key in obj2) result[key] = obj2[key];

2 - Object.keys（） ：

2 - Object.keys():

var 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 :(是），Opera：32，Safari： 9）

var result = Object.assign({},obj1, obj2);

4 - 点差运营商：

全新实现此目标的可能解决方案是使用 传播运营商 ，已从 ECMAScript 2015（第6版，ECMA-262）：

在规范的几个部分中定义：阵列初始化程序，参数列表

使用这种新语法，您可以将不同的对象连接/合并到一个对象中，如下所示：

Using this new syntax you could join/merge different objects into one object like this:

var result = {
  ...obj1,
  ...obj2,
};

5 - extend 的功能 jQuery 或 lodash ：

5 - extend function of jQuery or lodash:

var result={};
// using jQuery extend
$.extend(result, obj1, obj2);
// using lodash 
_.extend(result, obj1, obj2);

6 - lodash的合并功能：

6 - lodash's merge function:

var result=_.merge(obj1, obj2);

---

更新1：

请记住，在本机JavaScript中使用 for 循环，需要您了解您的环境基本JavaScript对象和全局数据类型中可能的原型更改。例如，如果您使用的是一个js lib，它将新内容添加到 Array.prototype 或 Object.prototype 。

Just keep in mind that using for in loop in native JavaScript, needs you be aware of your environment in terms of the possible prototype changes in the basic JavaScript objects and global data types. For instance if you are using a js lib that adds new stuff to Array.prototype or Object.prototype.

但是如果你愿意阻止这些可能添加的东西在中污染你的对象，你可以在循环中执行：

But if you are willing to prevent these possible added stuff from polluting your objects in for in loops you could do:

for(var key in obj1){
  if(obj1.hasOwnProperty(key)){
    result[key]=obj1[key];
  }
}

---

更新2：

我已经更新了我的答案并添加了解决方案编号4，这是一个新的JavaScript功能但尚未完全标准化。我正在使用 Babeljs ，它是编写下一代JavaScript的编译器。

I have been updated my answer and added the solution number 4, which is a new JavaScript feature but not completely standardized yet. I am using it with Babeljs which is a compiler for writing next generation JavaScript.

这篇关于如何在不使用JQUERY的情况下加入两个JavaScript对象的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！