Memory leakage on event handling
<p>I've been reading about memory leakages lately and haven't yet wrapped my head around all of it and have some questions regarding my own style of writing. Specifically, I'm not really sure if the way I handle events might be a source of leaking. Consider the following code </p>

<pre><code>function Wrapper(text) {
    this.text = text;
    this.bindHandlers();
};

Wrapper.prototype.onClick = function (e) {
    alert(this.text);
};

Wrapper.prototype.bindHandlers = function () {
    var t = this, div = $('&lt;div&gt;' + this.text + '&lt;/div&gt;');

    var reallyHugeArray = [1,2,3...]; // an array of 100000 elements for example

    div.click(function (e) {
        // all variables of the parent function are in scope for this function, including reallyHugeArray
        t.onClick(e);
    });

    $(document).append(div);
};

var a = new Wrapper('testString');

// had enough fun with the Wrapper, now let's nullify it
a = null;
</code></pre>

<p>As you can see, I like to use an anonymous functions as the event handler so that it would be more convenient to have access to instance specific variables (in this case <code>this.text</code> in the <code>onClick</code> function) and functions. However, if I understood correctly, having an anonymous function inside a function (as is the event handler), which has access to the local scope, disables the garbage collector from removing the local variables, therefore creating a leak. </p>

<p>So my question is whether this method of event handling can create memory leakages and if it does, is there any way to prevent it, but still have a similarily convenient way to access the instance variables and functions?</p>

<p>(Off-topic: a function inside a function inside a function makes Javascript sound like Inception)</p>
