1

I'm confused as to how object references work in Javascript with regards to arrays and haven't found any relevant material for this specific question. I have the following code. I initialize an array called arr of objects and set a new variable c equal to the first element in the array. If I alter the array element, the variable c is also changed as expected. Therefore I assume c is a pointer to the first element of the array.

However, If I set arr to a new array entirely, the variable c doesn't update. I would expect it to either A) Update to 'chameleon' which is the first element of the new array or, more likely, B) become undefined.

What object is the variable c pointing to after the arr is set equal to a new array? Does it become its own object?

var arr = [{animal: 'cat'}, {animal: 'bear'}];
var c = arr[0];
console.log(JSON.stringify(c.animal));
// Prints 'cat'

arr[0].animal = 'iguana';
console.log(JSON.stringify(c.animal));
// Prints 'iguana'

arr = [{animal: 'chameleon'}, {animal: 'bear'}];
console.log(JSON.stringify(c.animal));
// Prints 'iguana' instead of 'chameleon'
Improve this question
6
  • 2
    Does Javascript pass by reference? Commented Nov 8, 2016 at 18:08
  • 2
    why are you stringifying a string? Commented Nov 8, 2016 at 18:09
  • 3
    c is not a reference to arr[0], its a reference to the object you made on arr[0] Commented Nov 8, 2016 at 18:10
  • Note that you'll see the same effect if you do arr[0] = {animal: 'dog'}. Commented Nov 8, 2016 at 18:10
  • It's the same as it was before you changed what arr referenced. If you pointed at a new array in C the same behavior would occur-it's different data. Commented Nov 8, 2016 at 18:21

5 Answers 5

Reset to default
3

c isn't a reference to the first element of arr. It is a reference to an object, and that object just happens to be in arr. No matter what happens to arr, c will continue referring to that object unless you assign a new value to c.

In the second line before the end, you are overwriting the arr variable with a new value. The c value still refers to the same object it did already. Replacing arr with an entirely new value won't change that.

What object is the variable c pointing to after the arr is set equal to a new array? Does it become its own object?

The same object that it was pointing to before you reassigned arr. It hasn't changed.

Another demonstration:

var arr = [{animal: 'cat'}, {animal: 'bear'}];
var c = arr[0];

console.log(c.animal);
// Prints 'cat'

// access the value in arr[0] and modify its `animal` property
arr[0].animal = 'iguana';
console.log(c.animal);
// Prints 'iguana'

// REPLACE the 0th element of arr with a new value
arr[0] = { animal: 'pig' };
console.log(c.animal);
// still prints 'iguana'

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

Comments

2

It's actually very simple. c doesn't point to arr[0]. c points to the object stored at index [0] inside of arr. That binding stays intact even when arr is reassigned. In other words arr[0] is a means to an end - - to the object stored there. That's what c is referencing, not the instructions on how you got to it.

Now, if you were to run the var c = arr[0]; line again after reassigning arr, c would certainly point to a new object, but you didn't do this. You only assigned c once so it retains its reference to the original object.

Here's a very easy analogy. If I introduce you to my best friend, I have now established a relationship between you and that person (you know him because you went through me). But, If I get into a huge fight with that person (i.e. they are no longer my friend and I no longer have any relationship to them), it doesn't affect your ability to know that person. I simply introduced you two, but the reference is between you and him.

And remember, in JavaScript when you assign an object to a variable (or property), you are assigning a "reference" to that object, not the object itself.

Improve this answer

1 Comment

The last sentence seems to be a bit vague. It could give the impression to a less informed reader that you mean that JavaScript is pass by reference (which is not the case). What value arr[0] has is actually irrelevant wrt the relationship between c and arr[0] in this example.
1

I think the reason for your confusion is that you are thinking in terms of other languages like c, which use pointers that point to specific values in memory. In javascript, array and object variables store references to the actual array/object, the not array/object itself. When a reference is re-assigned, the original array/object is not overwritten, but instead, the reference is changed to point to a different object, also in memory.

For those reasons, in you example, re-assigning to arr will change the reference, pointing to the new array in memory. However, c, which was not re-assigned, will still reference the same object in the original array, which is also still in memory.

Hope that makes sense.

Improve this answer

Comments

0

Always be aware how you are passing values around:

http://docstore.mik.ua/orelly/webprog/jscript/ch11_02.htm

Improve this answer

Comments

0

You are reassigning the entire array (reference) that arr is pointing to - it is a completely new reference. The variable c points to the same reference as before because you have not changed the reference for c.

Improve this answer

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.