The really short answer to both your questions is that when you make one variable equal to another, a COPY of what's in the first variable is made and stored in the second variable - there is no linkage between the two variables.

But, read on for more details and why it can seem like there is a link in some cases...

JavaScript, like many languages, divides data into two broad categories: value types and reference types. JavaScript value types are its primitives:

• string


• number


• boolean


• null


• undefined


• symbol

When you assign any of these types to a variable, the actual data is stored in that variable and if you set one variable equal to another, a copy (not a linkage) of the primitive is made and stored in the new variable:

var a = 10;  // Store the actual number 10 in the a variable

var b = a;   // Store a COPY of the actual number stored in a (10) in the b variable

a = 50;      // Change the actual data stored in a to 50 (no change to b here)

console.log(a is:  + a);  // 50

console.log(b is:  + b);  // 10

When you work with reference types, something a little different happens. Assigning a variable to a reference type means that the variable only holds a reference to the memory location where the object is actually stored, not the actual object itself. So, when you do this:

var a = {foo:"bar"};

a does not actually store the object itself, it only stores the memory location for where the object can be found (i.e. 0x3C41A).

But, as far as setting another variable equal to the first goes, it still works as it did with primitives - - a copy of what's in the first variable is made and given to the second variable.

Here's an example:

// An object is instantiated in memory and a is given the address of it (for example 0x3C41A)

var a = {}; 

 

// The contents of a (the memory location of an object) is COPIED into b.

// Now, both a and b hold the same memory location of the object (0x3C41A)

var b = a;



// Regardless of whether a or b is used, the same underlying object

// will be affected:

a.foo = test;

console.log(b.foo); // test



// If one of the variables takes on a new value, it won't change

// what the other variable holds:

a = something else;

console.log(a is: , a);   // The new string primitive stored in memory

console.log(b is: , b);   // The object stored in memory location (0x3C41A)

So, in your first tests, you've simply got two ways of accessing one object and then you change what a is holding (the memory location of the object) to a different object and therefore now you only have one way left to access the original object, through b.

If we try to "clear" a through by setting a = {}, object b will remain
unchanged. I don't understand why manipulating an object in this way
produces a different result than in the 1st example.

Because now we know that a = {} isn't clearing the object. It's just pointing a at something else.