How does variable assignment work in JavaScript?

Question

So I played the other day to see how a bulk job in JavaScript works.

First I tried this example in the console:

a = b = {}; a.foo = 'bar'; console.log(b.foo); 

The result is a bar displayed in the warning. This is true, a and b are just aliases of the same object. Then I thought: how can I make this example simpler.

 a = b = 'foo'; a = 'bar'; console.log(b); 

It's almost the same, isn't it? This time it returns foo not bar as I would expect from the behavior of the first example.

Why is this happening?

NB This example can be further simplified with the following code:

 a = {}; b = a; a.foo = 'bar'; console.log(b.foo); a = 'foo'; b = a; a = 'bar'; console.log(b); 

(I suspect JavaScript handles primitives such as strings and integers differently with hashes. Hashes return a pointer, while "core" primitives return a copy of themselves)

Answer 1

In the first example, you set the property of an existing object. In the second example, you assign a completely new object.

 a = b = {}; 

a and b now point to the same object. Therefore, when you do this:

 a.foo = 'bar'; 

It also sets b.foo since a and b point to the same object.

However!

If you do this instead:

 a = 'bar'; 

You say that points to another object at the moment. a This has no effect on what was indicated earlier. a

In JavaScript, variable assignment and property assignment are two different operations. It’s best to think of variables as pointers to objects, and when you assign directly to a variable, you don’t change any objects by simply rearranging your variable to another object.

But assigning a property, such as a.foo , will change the object, a indicates a period. This, of course, also changes all other links pointing to this object, simply because they all point to the same object.

Answer 2

Your question has already been satisfactorily answered by Squeegy - it has nothing to do with objects and primitives, but with the reassignment of variables and property settings in the same reference object.

The answers and comments have a lot of confusion regarding JavaScript types, so here is a small introduction to a system like JavaScript:

JavaScript has two fundamentally different kinds of values: primitives and objects (and there is no such thing as a hash).

Strings, numbers and Booleans, as well as null and undefined are primitives, objects are all that can have properties. Even arrays and functions are regular objects and therefore can contain arbitrary properties. They simply differ in the internal property [[Class]] (functions additionally have a property called [[Call]] and [[Construct]], but hey, these details).

The reason primitive values ​​can behave like objects is related to autoboxing, but the primitives themselves cannot contain any properties.

Here is an example:

 var a = 'quux'; a.foo = 'bar'; document.writeln(a.foo); 

This will exit undefined : a contains the primitive value that is assigned to the object when the foo property is assigned. But this new object is immediately discarded, so the value of foo is lost.

Think of it this way:

 var a = 'quux'; new String(a).foo = 'bar'; // we never save this new object anywhere! document.writeln(new String(a).foo); // a completly new object gets created 

Answer 3

You are more or less correct, except that what you call a "hash" is actually just a shorthand syntax for an object.

In the first example, a and b both refer to the same object. In the second example, you change a to refer to something else.

Answer 4

here is my version of the answer:

 obj = {a:"hello",b:"goodbye"} x = obj xa = "bonjour" // now obj.a is equal to "bonjour" // because x has the same reference in memory as obj // but if I write: x = {} xa = obj.a xb = obj.b xa = "bonjour" // now x = {a:"bonjour", b:"goodbye"} and obj = {a:"hello", b:"goodbye"} // because x points to another place in the memory 

Answer 5

You set a to point to the new row object, while b continues to point to the old row object.

Answer 6

In the first case, you change some property of the object contained in the variable; in the second case, you assign a new value to the variable. These are fundamentally different things. Variables a and b not somehow magically connected by the first assignment, they just contain the same object. This is also the case in the second example until you assign a new value to the variable b .

Answer 7

The difference between simple types and objects.

Everything that an object (such as an array or function) is passed by reference.

Anything copied is a simple type (for example, a string or a number).

I always have a copyArray function, so I can be sure that I am not creating a bunch of aliases in the same array.