OO Javascript copy of object

Question

I have a question about how javascript copies objects with the below sample code:

var blue = {a:1};
var yellow = blue
yellow = 3;

In this case, blue's value would be unaffected as an object with a=1. However, when written like this:

var blue = {a:1};
blue.b = 2;
var yellow = blue
yellow.c = 3;`

in this case, console.log(blue) would show blue also having an extra {c:3} in it's object. How is the variable blue getting affected by yellow when the yellow = blue should be just yellow referencing blue and not vice versa?

That's because `yellow` is set to a "reference" of blue. You don't change blue, you change the value from a reference, to another value. I've written about this [here](http://stackoverflow.com/a/29871978/1620622) — Downgoat, Jul 09 '15 at 22:56
You can't natively "copy" objects in JavaScript. They are *similar* to pointers in languages like C++. — Derek 朕會功夫, Jul 09 '15 at 22:57
Not sure why this is being downvoted so much. It seems like an innocent misunderstanding of how javascript works. — Carlos Rodriguez, Jul 09 '15 at 22:59
@Kith Another quick search on Google gives [another SO post](http://stackoverflow.com/questions/509579/how-does-variable-assignment-work-in-javascript) that explains how assignments work. — Derek 朕會功夫, Jul 09 '15 at 23:02
Ah, I see. I guess that makes sense. But honestly, I don't think steve would have known to google for the words "by reference" or "by value". A lot of times I find answers to questions through these differently worded duplicates. Case in point, that "duplicate" answer that is cited now at the top of the post is, itself, a duplicate lol — Carlos Rodriguez, Jul 09 '15 at 23:04
Thank you everyone for the answers. You are right Kith, i have no idea what proper word for the concepts I'm asking here are since I just learned it today through trial and error. I'm now learning they are called pass by value/reference as a result of asking here. Down or up votes kinda doesn't matter to me lol. I learned from asking, that's all it matters. — DiSt8885, Jul 10 '15 at 01:16

score 2 · Accepted Answer · answered Jul 09 '15 at 22:57

In JS, all assignments are done by value.

However, in the case of objects, that value is a reference.

That is, if you use yellow = blue, both yellow and blue will contain the same object in memory. So you can't alter one without modifying the other one.

score 2 · Answer 2 · answered Jul 09 '15 at 22:58

In the first case:

var blue = {a:1};
var yellow = blue;   // yellow references blue...

yellow = 3;          // but not anymore. Now it's just a number.

In the second:

var blue = {a:1};
blue.b = 2;

var yellow = blue    // yellow references blue
yellow.c = 3;        // and still does, so yellow.c and blue.c are the same`

score 2 · Answer 3 · answered Jul 09 '15 at 22:58

When you assign a value to a variable, whatever value that variable had before is gone. That's what happens in your first sample.

When you assign a variable to a value that is an object, and you then modify that object (setting a property of it to some value), you still have that variable pointing that object. That's what happens in your second sample.

The other thing that happens in your second sample is that blue & yellow point to the same object, so modifying via blue is identical to modifying via yellow, and in both cases the effect "applies" to both variables (it's always the same object)

OO Javascript copy of object

3 Answers3