Received a question which I cant able to give the reason,
Declared a variable var arr1 = [2, 3];
then copied to another variable var arr2 = arr1;
Finally push arr2[0] = 1;
and the entire code looks like this,
var arr1 = [2, 3];
var arr2 = arr1;
arr2[0] = 1;
console.log(arr1, arr2);
The result we expect is [2, 3] [1, 3] but unexpectedly received [1, 3] [1, 3] i.e., Both the array values got updated.
Can anyone please mention why both the array results the same values?
arr1 and arr2 are references (similar to pointers in other languages). They reference the same Array object. You essentially have two pointers which point to the same container.
When you then try to get the contents of container to which these two 'pointers' point, it makes sense they give back the same value.
You can use slice: arr1.slice(0) as mentioned already, this should work for most cases.
In some cases you need a deep copy, one example is mentioned here, this is needed when arrays contain pointers to other objects, because you pretty much get an array of pointers to other objects, you need a deeper copy: http://james.padolsey.com/javascript/deep-copying-of-objects-and-arrays/
Use slice:
var arr1 = [2, 3];
var arr2 = arr1.slice(0);;
arr2[0] = 1;
console.log(arr1, arr2);
The slice(0) method means, return a slice of the array from element 0 to the end. In other words, the entire array. Voila, a copy of the array. The only caveat to remember here is that this method works if the array contains only simple data types, like numbers, strings and booleans. If the array contains objects or other arrays (a multi-dimensional array), then those contained "objects" will be copied by reference, retaining a connection with the source array. In such a case you will need to copy the array as a full-fledged object.
Just to be clear, when you do:
var arr1 = [2, 3];
then the value assigned to arr1 is a reference to the Array on the right hand side. When you do:
var arr2 = arr1;
Then the value of arr1 is assigned to arr2 so that the value of both variables is a reference to the same Array object. Therefore when you do:
arr2[0] = 1;
you are changing the array object and since arr1 and arr2 both reference the same Array, you get:
console.log(arr1, arr2); // [1,3], [1,3]
i.e. the same Array logged twice.
If you want to copy the array use
var arr2 = arr1.slice(0);
else you pass a pointer to the other var, which they point to the same object
When the value is being assigned to arr2, the local address of that value is assigned. When there is a change in the value at that address, it's reflected on both of the variables.
