6

The basic example:

var b = 10;
var c = b;
b++;
console.log(b,c);

>> 11 10

c looks like a copy of b.

But in another case:

var x = {};
var y = x;
x.abc = 10;
console.log(x.abc, y.abc);

>> 10 10

Why is the y not a copy of x, but a reference which points to the same instance x points to?

Also, I guessed b++ creates another instance, so b points to the new instance but c points to the old one. However...

var u = 10;
setTimeout(function() {
  console.log(u);
}, 10000)
u++;

>> 11

If u++ creates a new instance, then the u inside the anonymous function should point to the old u, shouldn't it?

Tiago
  • 4,233
  • 13
  • 46
  • 70
Lai Yu-Hsuan
  • 27,509
  • 28
  • 97
  • 164

4 Answers4

12

When primitives are assigned, they are assigned by value; references types (like your object) are assigned by reference (or, as Jon Skeet corrects me, they're assigned a copy of the reference).

In your second example x and y both point to the same object in memory. That's why adding an abc property to one, also adds it to the other

You'd also observe the same behavior passing x or y into a function

function addABC(foo) {
   foo.abc = 10;
}

var x = {};
var y = x;
addABC(x);
console.log(x.abc, y.abc);

Just note that, though x and y point to the same object in memory, they're separate copies of the reference, so this

    var x = { a: 1 };
    var y = x;
    y = {};
    alert(x.a);

and this

    var x = { a: 1 };
    var y = x;
    x = {};
    alert(y.a);

will still alert 1.

Adam Rackis
  • 82,527
  • 56
  • 270
  • 393
  • 1
    I don't like the terminology of "by reference" here - because *real" pass-by-reference or copy-by-reference is somewhat different. For example, suppose you changed your `addABC` method to `foo = "hello"`, that wouldn't change the value of `x`, would it? (Admittedly I'm *assuming* that JavaScript works the same way as Java and C# here, but I think it's a reasonable assumption.) – Jon Skeet Jan 09 '12 at 17:26
11

the c looks like a copy of b.

Both are references to the same immutable value.

Why the y is not copy of x but a reference which points to the instance x points to?

x was a reference to an object in the first place, so y is a copy of it (a copy of the reference, not a copy of the object).

If u++ creates a new instance,

It doesn't.

the u in anonymous function should points to the old u, shouldn't it?

u++ assigns a reference to 11 to u. The anonymous function is looking at u and not "the value of u at the time the function was created".

Quentin
  • 914,110
  • 126
  • 1,211
  • 1,335
  • 1
    @Quentin: so the original "object" just resides somewhere within the 'activation object' or 'lexical environment' created by the js-implementation (ES3/5) and can never really get touched by ECMAscript itself. – jAndy Jan 09 '12 at 17:36
  • 1
    "Both are references to the same immutable value." Doesn't that contradict the observed output "11 10"? The output would suggest that they are references to different values – Neptilo Feb 11 '18 at 22:21
  • @Neptilo — No. Read the bottom half of the answer. – Quentin Feb 12 '18 at 09:28
  • @Quentin So did you mean `b` and `c` are references to the same value *before* executing `b++`? But after, `b` becomes a reference to another value, right? – Neptilo Feb 12 '18 at 11:45
  • @Neptilo — Yes. – Quentin Feb 12 '18 at 11:46
  • @Quentin Thanks. That's what got me confused – Neptilo Feb 12 '18 at 11:47
  • "Both are references to the same immutable value." - this is what others refer as "assigned by value". – Alex Dec 05 '20 at 00:33
5

This statement:

var y = x;

copies the value of x as the initial value of y. However, the values involved are references to an object, not the object itself. Note that this is not the same as saying that the assignment copies "a reference to x" - it really is the value of x. So in particular, if you change the value of x to refer to a different object, e.g.

x = "something else";

then that won't change the value of y - its value will still be a reference to the original object.

Jon Skeet
  • 1,421,763
  • 867
  • 9,128
  • 9,194
0

  • The typeof value assigned to a variable decides whether the value is stored with assign-by-value or assign-by-reference

  • On variable assignment, the scalar primitive values (Number, String, Boolean, undefined, null, Symbol) are assigned-by-value and compound values (Object, Array) are assigned-by-reference

If there are doubts look into this its explained with examples Link: how references work

Vishal Dindalkop
  • 19
  • 3