Alterare e assegnare oggetti senza effetti collaterali

Al momento ho il seguente codice:

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; 

Il problema è che quando cambio il valore di id e value per il mio secondo elemento, i valori cambiano anche nel primo elemento. C’è un modo in cui posso continuare ad aggiungere nuovi elementi senza modificare il valore dei valori precedentemente inseriti nell’array?

Prova questo invece:

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

o non funzionerà per la tua situazione?

Questo è un caso da manuale per una funzione di costruzione :

 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)) 

È necessario continuare a creare nuovi oggetti o clonare quello esistente. Vedi Qual è il modo più efficace per clonare in profondità un object in JavaScript? per come clonare.

Questo perché i valori dell’object vengono passati per riferimento. Puoi clonare l’object in questo modo:

 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]); 

Risultato:

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

Se stai usando jQuery, puoi usare ext

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

Gli oggetti vengono passati per riferimento .. Per creare un nuovo object, seguo questo approccio ..

 //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; 

Avrai lo stesso object due volte nell’array, perché i valori dell’object vengono passati per riferimento. Devi creare un nuovo object come questo

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

o

myArray.push ({id: 24, valore: 246});