如何防止闭包保留javascript函数的参数？

Question

EDIT: The context for this question is, the argument is the source string for a module being loaded which could be huge, and there are many many modules being loaded this way, and each one has a closure with the original source code of the module held within it, using memory, when its not needed or wanted.

Specifically, I am trying to fix this https://github.com/dojo/dojo/blob/master/dojo.js#L367 code which leaks the module source into the closure.

<script>
function closureTest(n) {
    function eval_(__text) {
        return eval(__text);
    }
    for (var i = 0; i < n; i++) {
        var m = eval_("(function(){ var x = 10; return function(n) { return x+n; }; })(window);");
        m(5);
    }
}
</script>
<button onclick="closureTest(1000)">Run</button>

In the above code, if a breakpoint is placed inside the anonymous function, and the closures that exist are examined, we can see that one of the closures contains __text and arguments[0] that contains the original source code of the module as it was passed to eval_

Here is a variation of the above:

<script>
function closureTest(n) {
    function eval_() {
        return eval(arguments[0]);
    }
    for (var i = 0; i < n; i++) {
        var m = eval_("(function(){ var x = 10; return function(n) { return x+n; }; })(window);");
        m(5);
    }
}
</script>
<button onclick="closureTest(1000)">Run</button>

In this case, the closure no longer contains __text but does still contain arguments[0] with the string passed to eval_.

About the best I could come up with is the following, which deletes the argument to eval_ after processing it, a side effect is that the module being defined now also appears in the closure as a variable called module.

<script>
function closureTest(n) {
    function eval_() {
        var module = eval(arguments[0]);
        delete arguments[0];
        return module;
    }
    for (var i = 0; i < n; i++) {
        var m = eval_("(function(){ var x = 10; return function(n) { return x+n; }; })(window);");
        m(5);
    }
}
</script>
<button onclick="closureTest(1000)">Run</button>

Is there a better way to prevent the closure retaining a copy of the argument passed to eval_?

Answer 1

[EDIT] Completely missed the point of the question.

Short answer: You cannot. As you are aware, a closure maintains the environment state from which it was created; there's no way to "break out" of a closure scope hierarchy.

When you call m() you are not calling it within a global context, but rather part of a chain of environments of, not only the eval_ closure but also closureTest as well -- You can see your returned eval'ed function also has access to the i and n vars defined in closureTest .

So, you cannot restrict or break out of a closure. However, if you define a new variable in your new scope with the same name as a variable from a previous closure you lose direct access to that. Therfore, your middle example is as close as you can get:

function closureTest(n) {
    function eval_() {
        return eval(arguments[0]);
    }
    for (var i = 0; i < n; i++) {
        var m = eval_("(function(){ var x = 10; return function(n) { return x+n; }; })(window);");
        m(5);
    }
 }

Here, your returned eval'ed function cannot access eval_ 's arguments since it's own arguments have overridden it (it does, however, still have access to i and n from the for loop). This means, functionally, that eval'ed string cannot access the arguments passed to eval_ .

Notes:

• Yes, when you set a breakpoint in DevTools you can inspect the parent closures however that does not impact the fact that the executing function cannot directly access eval_ 's `arguments[0] .
• Also, the function could get the string of the upper functions using arguments.callee.caller.toString(); etc. This still doesn't allow the function direct access to redefined vars, but thought it was worth mentioning.