1

I was reading on this blog about how if an object or array were changed inside of a function, the value in memory that was pointed to would be changed as well, the same as if it were changed outside the function.

var a = [1,2,3],
    b = a;

b[0] = 5;
console.log(a); // [5, 2, 3]

would result in the same as

var a = [1,2,3],
    b = a;

var arrayFunction = function(arr){
   arr[0] = 10;
};

var arr = arrayFunction(b);

console.log(a, b, arr) // [10, 2, 3], [10, 2, 3], [10, 2, 3];

Yet what I can't understand is why reassigning multiple array values within the function does not change the values outside of it:

var a = [1,2,3],
    b = a;

var arrayFunction = function(arr){
   arr = ["a", "b", "c"];
   return arr;
};

var result = arrayFunction(b);
console.log(result) //["a", "b", "c"]
console.log(a, b);  //[1, 2, 3], [1, 2, 3]

Why does this not change the pointed to value in memory like in the first example?

Probably a better job of writing out the examples on the JSBIN

1252748
  • 14,597
  • 32
  • 109
  • 229
  • 2
    this should answer your question: http://stackoverflow.com/questions/6605640/javascript-by-reference-vs-by-value – Pevara Jun 28 '13 at 19:53

3 Answers3

3

This is because objects in javascript aren't really passed by reference. I've seen it referred to as "passed by copied reference", or "passed by handle" - both of which do a better job of describing what's really happening.

In this example:

var b = [1, 2, 3];
var arrayFunction = function(arr) {
   arr = ["a", "b", "c"];
};
arrayFunction(b);

The object reference itself is passed by value. You're not actually changing the value of the b variable. However, your function argument (arr) and the b variable are initially pointing to the same object - so if you change one, you can reference the object through either and see the change.

When you reassign arr to point to a different object though, the b variable is still pointing to the old object, and does not change.

jcsanyi
  • 8,133
  • 2
  • 29
  • 52
2

Remember that, within the function, arr is not the actual array; arr is a reference that points to the array.

So when you say arr[0], you're retrieving the array, and then getting or updating an item in it.

But when you say arr = ["a","b","c"], you are creating a new object (on the right side) and then turning arr into a reference that points to the new object.

Jacob Mattison
  • 50,258
  • 9
  • 107
  • 126
1

In Javascript a variable merely points to an array; so if you copy the variable you get two variables pointing to the same array:

var a = [1,2,3];
var b = a;

Changing an element of the array with a[0] = 99 will be observable with both variables because there is just one array and both a and b are pointing to it.

When you write instead

a = [5, 6, 7];

you are setting a to point to another different array.

Javascript never makes a copy of an array unless you ask it explicitly (e.g. with b = a.slice()).

Actually the very same happens with any value (objects for example). With numbers and string the same logic is also valid, but it's hard to notice the difference between a copy and sharing the same object because numbers and strings cannot be changed (the're "immutable").

In other languages like C and C++ instead variables contain the value, not a pointer; so when making an assignment for example objects are copied from one variable to the other and if you want a pointer you've to ask explicitly for it.

6502
  • 112,025
  • 15
  • 165
  • 265