javascriptclosures

Example of a circular reference in Javascript?


I was wondering if anyone has a good, working example of a circular reference in javascript? I know this is incredibly easy to do with closures, but have had a hard time wrapping my brain around this. An example that I can dissect in Firebug would be most appreciated.

Thanks


Solution

  • A simple way to create a circular reference is to have an object that refers to itself in a property:

    function Foo() {
      this.abc = "Hello";
      this.circular = this;
    }
    
    var foo = new Foo();
    alert(foo.circular.circular.circular.circular.circular.abc);
    

    Here the foo object contains a reference to itself.

    With closures this is usually more implicit, by just having the circular reference in scope, not as an explicit property of some object:

    var circular;
    
    circular = function(arg) {
      if (arg) {
        alert(arg);
      }
      else {
        // refers to the |circular| variable, and by that to itself.
        circular("No argument");
      }
    }
    
    circular("hello");
    circular();
    

    Here the function saved in circular refers to the circular variable, and thereby to itself. It implicitly holds a reference to itself, creating a circular reference. Even if circular now goes out of scope, it is still referenced from the functions scope. Simple garbage collectors won't recognize this loop and won't collect the function.