0

I am currently learning about objects in javascript.

I have encountered behaviour I didn't expect and I want to confirm if I am seeing what I should be seeing or if I have made a mistake somewhere.

var a = 1;
var b = a;
b++;
console.log(a); // 1 (As expected)
console.log(b); // 2

var a = 'string';
var b = a;
b += 'ier';
console.log(a); // string (As expected)
console.log(b); // stringier

var a = {};
var b = a;
b['testValue'] = 'test';
console.log(a); // {testValue = 'test'} (Wait... what?!)
console.log(b); // {testValue = 'test'}

Added:

I've just tried the same experiment with an array and I see the array is exhibiting the same behaviour as the object (perhaps to be expected, given that arrays are objects in Javascript)

var a = [];
var b = a;
b[0] = 'test';
console.log(a); // ['test'] (Hmmm... again!)
console.log(b); // ['test']

Why are the object and the array behaving differently from the number and the string?

Why is var b only referencing var a rather than duplicating it?

Rounin
  • 27,134
  • 9
  • 83
  • 108
  • 1
    `var a = b` doesn't copy the value of `a` into `b` but rather copies the *reference* to `a` so they're both pointing to same object in memory. See https://developer.mozilla.org/he/docs/Web/JavaScript/Guide/Working_with_Objects – haim770 Jan 03 '17 at 14:40
  • Both `b++` and `b+='ier'` return new values and set `b` to reference the new value. Hence `a` remains unchanged in your first two instances. – Phylogenesis Jan 03 '17 at 14:40
  • Quite. I was expecting `a` to remain unchanged in all instances. – Rounin Jan 03 '17 at 14:41
  • 1
    Objects and Arrays are not treated as primitive type. In your case, Object/Array 'a' & 'b' aren't two of them; assigning the value of "a" to "b" assigns the reference to the array, not a copy of the array. Refer http://stackoverflow.com/questions/4220611/why-does-changing-one-array-alters-the-other – Anurag Sinha Jan 03 '17 at 14:41
  • 1
    or http://stackoverflow.com/questions/13104494/does-javascript-pass-by-reference or http://stackoverflow.com/questions/6605640/javascript-by-reference-vs-by-value – epascarello Jan 03 '17 at 14:42
  • 1
    This confusion basically stems from the fact that `Number` and `String` are immutable and `Object` and `Array` are mutable. – Phylogenesis Jan 03 '17 at 14:43
  • 1
    Check out: http://stackoverflow.com/questions/122102/what-is-the-most-efficient-way-to-deep-clone-an-object-in-javascript – thekodester Jan 03 '17 at 14:44
  • Thanks everyone, I think I understand better now: variables representing `numbers` & `strings` both point directly to immutable primitives. You can point those variables at other immutable primitives, but you can't (for instance) change `5` into `6` or `crocodile` into `alligator`. By contrast, variables representing `objects` (including arrays) _don't_ point to a composite but to a mutable reference value referencing that composite. When you "update an object", you only actually update the reference value. Consequently all variables pointing at the same reference value now reflect the update. – Rounin Jan 03 '17 at 16:18

0 Answers0