0

I have a habit of declaring every variable in a scope at the top block for code readability. I'm suspecting that nodes inside a function scope that are not added to the body of a document clutter up space, and reduce performance. What happens to them? And in general what happens to variables created inside a function scope? Are they destroyed after the function is executed? Do I need to worry about deallocating memory? Is it a good practice to declare variables at the top most block of a scope or is it better to only declare them at the spot when they are needed or when some condition is true? Does this help to improve run time performance?

Assume a function like this:

function myfunc() {
    var someNode = document.createElement('div');
    if(someCondition) { // add the node only if some condition is true
        document.body.appendChild(someNode);
    }

V.S a function like this:

function myfunc() {
    if(someCondition) { // create and add the node only if some condition is true
        var someNode = document.createElement('div');
        document.body.appendChild(someNode);
    }
}
ilgaar
  • 804
  • 1
  • 12
  • 31

1 Answers1

5

Javascript implements automatic memory management with garbage collection. If there are no variables in scope that reference a piece of data, the memory should be reclaimed. So in your example, the unused DIV will be destroyed when the function exits (or soon after, when the next garbage collection occurs).

However, it's better to avoid making an object you don't need. It takes time, and uses up memory while the function is running. It's not too bad for small, simple objects (i.e. something you create with a literal {...} syntax) and arrays, but nodes are pretty complex objects.

Barmar
  • 741,623
  • 53
  • 500
  • 612
  • 1
    Also, the place where the variable is *declared* doesn't matter (as variable declarations are always [hoisted](http://stackoverflow.com/questions/3725546/variable-hoisting) to the top of their scope); what matters is the place where the node is created and assigned to the variable. – bfavaretto Jul 10 '13 at 15:06
  • The exception is older IE's handling of closures where a nested function will retain everything in scope even if not directly referenced. Though that's not so much of an issue these days. But +1 for *"it's better to avoid making an object you don't need"*. Garbage collection doesn't mean we don't need to think about memory. –  Jul 10 '13 at 15:10
  • 1
    @bfavaretto When the OP write "habit of declaring every variable", I think he actually meant "habit of assigning every variable", as per his example. – Barmar Jul 10 '13 at 15:14
  • @Barmar He seems to be unaware of hoisting, I thought pointing that out could help. – bfavaretto Jul 10 '13 at 15:27
  • @Barmar good point on not creating an unused object. Based on what you said, I think it's better to create objects, specially nodes, right when they are needed. Also I'm aware of hoisting, but I find it easier to read and debug a code when all used variables are assigned at the top of a block. – ilgaar Jul 10 '13 at 15:57