Javascript从另一个对象向对象添加元素

时间:2017-03-22 00:42:50

标签: javascript jquery

我有一个对象。 data对象中的第一个元素如下所示:

data[0] = {name:"Bob", model:"Tesla", color:"white"};

和第二个对象,其第一个元素如下所示:

new_data[0] = {salary:"50000", age:"34"};

datanew_data的长度相同,new_data对象中的每个元素都需要附加到相关的data对象上,以生成类似这样的内容:

data[0] = {name:"Bob", model:"Tesla", color:"white", salary:"50000", age:"34"};

之前我曾使用concat将元素添加到单个行对象中(var

people = ["Dan","Bob"];
people.concat("Mike");

,但同样的想法在这里不起作用:

for ( var i = 0;i<data.length; i++ ) {
   data[i] = data[i].concat(new_data[i]);
}

如何循环使用?

6 个答案:

答案 0 :(得分:2)

MDN

Object.assign()方法用于将所有可枚举的自有属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。

  

如何循环使用?

考虑到Object.assign(),我们可以像下面一样循环播放它:

var data = [];
data[0] = {name:"Bob", model:"Tesla", color:"white"};
data[1] = {name:"Martin", model:"Ford", color:"Blue"};
data[2] = {name:"Danny", model:"BMW", color:"Purple"};

var new_data =[];
new_data[0] = {salary:"50000", age:"34"};
new_data[1] = {salary:"45000", age:"24"};
new_data[2] = {salary:"10000", age:"39"};

for(var i = 0; i < data.length; i++){    
    data[i] = Object.assign(data[i], new_data[i]);
    console.log(data[i]);
}

答案 1 :(得分:2)

因此,您已使用jQuery标记了您的问题,我已使用下面的$.extend()方法(jQuery Documentation)。

这只是针对您案例的单线解决方案。通过将true传递给此方法,您可以轻松地将object2合并到object1中。 jQuery很聪明地发现你的两个对象都是相同长度的数组,所以输出是一个数组,结果数组中的每个项都是两个对象的合并结果。

Object.assign是全新的(ES6),并非所有浏览器都支持Source)。但是这种jQuery方式可以节省支持所有浏览器的时间。

&#13;
&#13;
var collection1 = [{
    name: "Bob",
    model: "Tesla",
    color: "white"
  },
  {
    name: "Bob 1",
    model: "Tesla 1",
    color: "white 1"
  }
];
var collection2 = [{
    salary: "50000",
    age: "34"
  },
  {
    salary: "50001",
    age: "35"
  }
];

var result = $.extend(true, collection1, collection2);

console.log(result);
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
&#13;
&#13;
&#13;

答案 2 :(得分:1)

您可以使用jQuery.extend功能,如下所示。它使用data[i] object。

中的属性扩展现有new_data[i]对象
for ( var i = 0; i<data.length; i++ ) {
   jQuery.extend(data[i], new_data[i]);
}

答案 3 :(得分:0)

最有效的方法是遍历 new_data 中的每个元素,并将其应用于数据

    function change(){

function count(num) {
    if(!num)
        num = 1;
        var x = document.getElementsByClassName("box");
        x[0].innerHTML = num;     

    if(num < 10) {
        setTimeout(function() { count(num + 1); }, 1000);
   }
}
    setTimeout(count, 1000);

}

答案 4 :(得分:0)

如果class FormBuilder{ List<ShapeBuilder> shapeBuilderList; @Inject public FormBuilder(@Named("Circle")ShapeBuilder circle, @Named("Triangle")ShapeBuilder triangle,@Named("Square")ShapeBuilder square){ shapeBuilderList = new ArrayList<>(); //add all of them shapeBuilderList.add(circle); } } 如此,您需要使用的内容:

Object.assign

这将改变for ( var i = 0;i < data.length; i++ ) { Object.assign(data[i], new_data[i]); }

的内容

data旨在与数组一起使用。它会将一个(或多个)数组附加到另​​一个数组的末尾。

concat

答案 5 :(得分:0)

您可以利用其中一个对象的键来合并这两个。这也适用于IE9及以上版本。如果你需要防止覆盖基础对象中的属性,那么你可以在forEach调用中分配之前为该密钥添加快速的真正检查。

var obj1 = {id:1, name: "bob"}
var obj2 = {dob: "2000101"};

Object
.keys(obj1)
.forEach(function(k){
  obj2[k] = obj1[k];
});

console.log(obj2);