How does a javascript circular reference work?

Question

I'm not sure why this works.

var a = {};
a.hello = a;

If you explore the object in the console you'll see something like this:

a.hello = a is a circular reference. It seems that when we assign a.hello = a everything would blow up. Can someone explain what is happening internally?

Answer 1

You have a single object.

That object contains a property, which is a pointer to the same object.

That's all.

From there, you can continually recurse into a.hello.hello.hello.hello as much as you like, but you're still just referencing the same object. That is, a.hello === a.hello.hello for any depths.

Given that window behaves in the same way (window.window.window.window.MUSHROOM) it's a good thing it doesn't "blow up"!