Detailed Explanation of JavaScript Object Reference and Assignment Instance

This article illustrates JavaScript object reference and assignment. Share it for your reference, as follows:

<script type="text/javascript">
// Example 1:  Quote 
var myArrayRef = new Array(0,1,2); // To create an array object 
var mySeconArrayRef = myArrayRef; //  Object replication .
myArrayRef[0] = 100; //  Modify element value 
alert(mySeconArrayRef[0]);
/**
*  Output  100;  Anyone who has studied other languages should know that what should be output here is 0  Why is the output 100 What about ?
*  The above program passes the myArrayRef Object is copied to the mySeconArrayRef At this time, it exists 2 An independent   But the initial value is the same object 
*  Why is it modified because it is independent myArrayRef Will say goodbye 1 Does the object have an impact ? Everyone knows that only when they quote the same 1 Objects are modified at this time 1 A talent 
*  Farewell 1 Individual impact . But in javascript Objects created in the language myArrayRef The reference to the object is saved in the value at that time ( That is 1 Address ).
*  That is   I use  new Array The generated is saved in memory and new Array Told me where it was myArrayRef,myArrayRef I told this address again mySeconArrayRef
*  They both point to new Array Generate the address of the object instead of saving the object in the myArrayRef Medium , So through one of the 1 When modifying a value, it is the object that modifies their identical image .
*/
alert(mySeconArrayRef[0] );
// Example 2:  Assignment 
var myVa = 'ABC'; // Put ABC Value of   Endowed with myVa
var myVb = myVa; // myVa  Assign a value to  myVb
myVa = 'DEF'; // Modify myVa
/**
*  Output is :ABC.  Because the value is saved in the variable   Instead of saving the reference address , So the two of them are relatively independent as a whole .
*/
alert(myVb);
</script>

If you really want to copy objects without affecting each other, copy your methods and properties by transforming assignment or traversing key: value.

Note: The child object of an object is also a reference, so when traversing and assigning values, it is necessary to judge whether the child element is an object. If the child element is an object, continue traversing and assigning values to the child element.

Transform assignment method:

var data = {a:1,b:2,c:3,d:[0,1,2,3]};
var str = JSON.stringify(data);
var data1 = $.parseJSON(str); //$ For jQuery Object needs to be introduced jQuery Bag 
data1["e"] = 4;
data1["d"][0] = 11;
console.log(data);
console.log(data1);

Output:

{a: 1, b: 2, c: 3, d: [0,1,2,3]}
{a: 1, b: 2, c: 3, d: [11,1,2,3], e: 4}

There is no influence on each other

When object references are passed as function parameters, they still affect each other. Remember, the following example:

var data = {a:1,b:2,c:3,d:{q:4,w:5,e:6}};
var data1 = data;
function con(data2){
data2["r"] = 5;
console.log(JSON.stringify(data2));
}
con(data1);
console.log(JSON.stringify(data));

Output:

{"a":1,"b":2,"c":3,"d":{"q":4,"w":5,"e":6},"r":5}
{"a":1,"b":2,"c":3,"d":{"q":4,"w":5,"e":6},"r":5}

After the object reference is assigned, if the object is left empty, it will not affect each other, as follows:

var arr = {"a":"1","b":"2"};
var arr1 = arr;
arr = {};
arr["a"] = 2;
console.log(arr1);
console.log(arr);

Output:

{"a":"1","b":"2"} , {"a":2}

More readers interested in JavaScript can see the topics of this site: "javascript Object-Oriented Introduction Tutorial", "JavaScript Error and Debugging Skills Summary", "JavaScript Data Structure and Algorithm Skills Summary", "JavaScript Traversal Algorithm and Skills Summary" and "JavaScript Mathematical Operation Usage Summary"

I hope this article is helpful to everyone's JavaScript programming.