JavaScript best practice, Using closures

Question

Hey I read at Google article (here) that we need to be careful when using closures.
For example, they gave there this function:

function foo(element, a, b) {
    element.onclick = function() { /* uses a and b */ };
}

And I quote:

the function closure keeps a reference to element, a, and b even if it never uses element. Since element also keeps a reference to the closure, we have a cycle that won't be cleaned up by garbage collection.

And I also read an article on the module pattern , and there is a lot of use in closures

for example if I declare a module like that:

(function () {
    var a = function () { };
    var b = function () { };
}());

So b have access to a , meaning its also save reference to all functions declared on the module.

Is it considered bad practice too?

This is more a discussion than a code-specific question. Incidentally, friendly hint: reAd, not red :) — Mitya, Apr 01 '17 at 10:37
@Utkanos - actually, I think it is a code-specific question, although I don't have deep-enough knowledge of JavaScript to answer it. I believe that the quote indicates that the function sans parameters holds a reference to the entire enclosing scope. Whether this does indeed prevent GC (it shouldn't, except in a reference-counting model), or whether the inadvertant reference can be avoided by explicitly passing `a` and `b` to the inner function, is (I believe) the real question here. — kdgregory, Apr 01 '17 at 12:18

score 2 · Answer 1 · edited May 23 '17 at 12:17

The statement you quoted is rubbish.

the function closure keeps a reference to element, a, and b even if it never uses element.

No it doesn't.

Since element also keeps a reference to the closure, we have a cycle that won't be cleaned up by garbage collection.

No they will¹.

_{(1: We tend to ignore ancient buggy internet explorers)}

So to answer your question: No, those are not bad practices.

score 1 · Answer 2 · answered Apr 01 '17 at 10:50

Yes, we need to be careful with any advanced feature, but the short answer is that they have a useful role to play.

The purpose of closure is to retain variables for later. If you never use those variables, then obviously you’re hanging on to data unnecessarily.

JavaScript garbage collection is pretty good, and it’s getting better. But it still has to try to work out when you’ve truly finished with a variable, and it’s not psychic.

On the other hand the most important part of using closures is they allow you to define variables of limited scope, so you can reduce your reliance on global variables, which are definitely far more problematic than a few extra closure variables.

The real problem with closure variables is not the extra memory they consume, but misunderstanding when they apply. For example, many new JavaScript developers when they find a loop variable has been retained when after the value has been assigned.

Many JavaScript developers bloat their code with truck loads of libraries which create huge and complex objects to perform simple tasks. That will be a much greater cost to consider.

The short answer is that, used judiciously, closures are valuable, and often the best way to perform a task.

JavaScript best practice, Using closures

2 Answers2