3

This is my example code:

var foo = {a : 1};
var bar = foo;
console.log(bar.a);//1, as expected
foo.a = 2;
console.log(bar.a);//2, as expected, as objects are passed by reference
foo = {a : 10};
console.log(bar.a);//2, not expected, I expected 10

The last log doesn't give the expected result. Thinking that foo = {a : value} is the same as foo.a = value I expected that last result was 10. What's wrong with my expectation? I think I am missing a big lesson here.

Ferex
  • 553
  • 6
  • 22
  • Objects are not passed by reference, they are passed by value. Eveything is passed by value in JS, but those values can point to the same object in memory. – elclanrs May 25 '15 at 08:14
  • This is incorrect. Values don't point anywhere. They are values. Only references point to something. And object aren't passed by value. – marekful May 25 '15 at 08:15
  • @elclanrs object that point to object in memory is _reference_ :-) – Grundy May 25 '15 at 08:16
  • 2
    @marekful http://stackoverflow.com/questions/518000/is-javascript-a-pass-by-reference-or-pass-by-value-language – elclanrs May 25 '15 at 08:16
  • 2
    No, it is not the same idea. It is still passed by value, technically it is is called "pass by sharing", afaik. – elclanrs May 25 '15 at 08:16

5 Answers5

1

You set foo initially to one object:

var foo = {a : 1};

and later overwrite it with completely new object:

foo = {a : 10};

In this case foo and bar are no longer connected, because the reference is now broken.

dfsq
  • 191,768
  • 25
  • 236
  • 258
  • I thought that to write a completely new object I had to write `var foo = ...` – Ferex May 25 '15 at 08:16
  • 1
    No, `var` just defines a variable. You can define it and later assign new value to it, which will overwrite previous one. This is what you are doing in your code. – dfsq May 25 '15 at 08:19
  • also if `var` missed, with assigning variable would defined in global scope – Grundy May 25 '15 at 08:24
0

When you reach this line of code:

foo = {a : 10};

foo is assigned a new variable; from this point on foo and bar are two different variables and for this reason the last line prints 2 as bar is still pointing to the old value.

pinturic
  • 2,253
  • 1
  • 17
  • 34
0

You are reassigning foo to a new object literal on the 2nd to last line. Bar still points to the old object, thus you get 2 (which you modified on the 4th line).

If that explanation doesn't clear things up, it might be helpful to step back and try to understand variables, objects, and references on a higher level. Eloquent JavaScript's Data Structures chapter might be a good place to start.

edit: A point worth clarifying: it's important to understand you're not overriding anything, you just changed foo's reference. They point at different things in memory now. That's why bar is the same.

Sze-Hung Daniel Tsui
  • 2,282
  • 13
  • 20
0
var foo = {a : 1};  //foo refering to object {a : 1}
var bar = foo;      //bar refering to same object as foo
console.log(bar.a); //1, as expected
foo.a = 2;          //The object to which bar and foo are pointing gets changed
console.log(bar.a); //2, as expected, as objects are passed by reference
foo = {a : 10};     //foo starts pointing to the newly created object, whereas bar is still refering the old object(no change in bar) and the earlier object `{a : 1}` exists and poinyted to by bar
console.log(bar.a); //2, not expected, I expected 10 //hence this result
shruti1810
  • 3,920
  • 2
  • 16
  • 28
0

first you have assigned foo to bar at that time the ref of foo is sent to bar.

now if you change the value bar.a then foo will be changed

foo = {
    a: 2
}

bar = foo
console.log(bar.a) //gives 2

bar.a = 30

console.log(foo.a) //gives 30

but when you over-write foo, the connection will be lost and both act like 2 individual variables

so now

foo.a = 20
console.log(bar.a) //gives 30
console.log(foo.a) //gives 20
Strikers
  • 4,698
  • 2
  • 28
  • 58