在没有副作用的情况下更改和指定对象

Alter and Assign Object Without Side Effects

本文关键字：对象 情况下 副作用      更新时间：2023-09-26

我目前有以下代码：

var myArray = [];
var myElement = {
  id: 0,
  value: 0
}
myElement.id = 0;
myElement.value = 1;
myArray[0] = myElement;
myElement.id = 2;
myElement.value = 3;
myArray[1] = myElement;

问题是，当我改变第二个元素的id和value的值时，第一个元素中的值也会改变。有没有一种方法可以在不改变数组中先前插入值的值的情况下继续添加新元素？

试试这个：

var myArray = [];
myArray.push({ id: 0, value: 1 });
myArray.push({ id: 2, value: 3 });

或者这对你的情况不起作用？

这是构造函数的教科书案例：

var myArray = [];
function myElement(id, value){
    this.id = id
    this.value = value
}
myArray[0] = new myElement(0,1)
myArray[1] = new myElement(2,3)
// or myArray.push(new myElement(1, 1))

您要么需要继续创建新对象，要么克隆现有对象。请参阅在JavaScript中深度克隆对象的最有效方法是什么？了解如何克隆。

这是因为对象值是通过引用传递的。你可以这样克隆对象：

var myArray = [];
var myElement = {
  id: 0,
  value: 0
}
myElement.id =0;
myElement.value=1;
myArray[0] = myElement;
var obj = {};
obj = clone(myElement);
obj.id = 2;
obj.value = 3; 
myArray[1] = obj;
function clone(obj){
  if(obj == null || typeof(obj) != 'object')
    return obj;
  var temp = new obj.constructor(); 
  for(var key in obj)
    temp[key] = clone(obj[key]);
  return temp;
}    
console.log(myArray[0]);
console.log(myArray[1]);

结果：

 - id: 0
 - value: 1
 - id: 2
 - value: 3

如果您使用jQuery，您可以使用扩展

myElement.id =0;
myElement.value=1;
myArray[0] = $.extend({}, myElement);
myElement.id = 2;
myElement.value = 3;
myArray[1] = $.extend({}, myElement);

对象通过引用传递。。要创建一个新对象，我遵循以下方法。。

//Template code for object creation.
function myElement(id, value) {
    this.id = id;
    this.value = value;
}
var myArray = [];
//instantiate myEle
var myEle = new myElement(0, 0);
//store myEle
myArray[0] = myEle;
//Now create a new object & store it
myEle = new myElement(0, 1);
myArray[1] = myEle;

您的数组中将有两次相同的对象，因为对象值是通过引用传递的。你必须创建一个像这样的新对象

myElement.id = 244;
myElement.value = 3556;
myArray[0] = $.extend({}, myElement); //for shallow copy or
myArray[0] = $.extend(true, {}, myElement); // for deep copy

或

myArray.push（｛id:24，value:246｝）；

相关文章：