0

In Javascript, when I use the extend function in the underscore.js library... can somebody please conceptually / visually describe to me what happens in the back-end in regards with memory - with this example:

var obj = {hello: [2]};
var obj2 = {hola: [4]};
_.extend(obj, obj2)
obj2.hola = 5;
console.log(obj) // hola still has a value of `[4]`

My issue is if I console.log(obj), for some reason, hola still has a value of [4]. I fully thought I would get the value 5 (via pass by reference)...

For the above example, here is what is visually / conceptually going on in my head:

  1. The extend function deeply copies the key hola into obj:

    obj = {hello: [2], hola: TBD} ]btw - is obj storing only one memory address for this object?

  2. Then I suspect that hola stores a memory address to the value of [4] (so at this point I suspect obj would be

    obj = {hello: [2], hola: #0x93490234}

Which is why I fully expected to see a 5 under obj. Can you tell me what's wrong with my visualization above?

Lastly, with the explanation, can you point out how the above example is any different than the following example (I understand how / why the below example works - just not the above example and would like to hear why the below works and the above doesn't).

var obj2 = {hola: [4]};
var obj = obj2;
obj2.hola = 5; //console.log(obj) will say that hola equals 5
Improve this question
17
  • 1
    All arguments in JavaScript are passed by value, all the time. Read this for explanation. Commented Jul 6, 2018 at 22:15
  • Thanks @ScottMarcus - I read the explanation in your link, but it didn't quite help me. I don't have a function in my example / no arguments. I'm not sure how it relates to my question - any guidance would be appreciated... Commented Jul 6, 2018 at 22:19
  • 1
    You do have a function in your example .extend() and you are passing arguments to it. Those arguments are being passed by value. Commented Jul 6, 2018 at 22:21
  • 1
    _.extend copies the properties that obj2 has at that moment to obj. Changing obj2 afterwards has no effect on obj. Commented Jul 6, 2018 at 22:24
  • 1
    I was just trying to help you understand that there is no such thing as pass by reference in JavaScript. Commented Jul 6, 2018 at 22:33

1 Answer 1

Reset to default
-1

Maybe this helps:

Lets distinguish between two concepts first: values and bindings. A value is a piece of data, like a string, number, boolean, object, etc. Every value is stored in memory and has an address.

A binding is like a container or label that holds an address.

  • when assigning a value to a binding we are assigning the address of the value
  • when accessing a binding we get the value stored at that address

Example:

var a = 42;

a is a binding, 42 is a value. Lets say 42 is stored in memory at 0x1, then a really holds the address 0x1.

When we are trying to read the value, e.g.

console.log(a);

we need to look at address 0x1 to get the actual value.

Now what happens when we "assign a binding to another binding", i.e. bar = foo?

var foo = 42; // 0x2
var bar = foo;

42 is stored at 0x2. So foo holds the address 0x2. When we assign a binding to another one, we simply copy the address that the binding holds. So after var bar = foo;, both foo and bar hold the address 0x2. If I assign a new value to foo, e.g.

foo = 21;

then I'm making foo hold a new address (e.g. 0x3).

This does not change the address that bar holds.

Exactly the same applies to object properties.

Mutable values

Now you might wonder "why does foo and bar both change in the following example:

var foo = [42];
var bar = foo;
foo.push(21);
// bar also has [42, 21]

Lets assume [42] is stored at memory location 0x4.

Here is how it is different to the previous example:

We did not assign a new value to foo.

Instead we referenced the array (at address 0x4) through foo and mutated it. Mutable values are values that can be changed in place, i.e. the bits at that memory location can change.

After calling foo.push, foo still holds the address 0x4 and so does bar.

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.