Is it good practice to set variables to null when they are no longer needed?

Question

I have seen javascript values set to null at the end of a function. Is this done to reduce memory usage or just to prevent accidental u

Answer 1

Yes very much so. Especially if the variable has some secret information such as a returned password.

As soon as you use the variable declare it as null or "" because active variables in js can be read using inspect element.

var password = $('#password').val();

After evaluating variable password reset it to "". If you do not the value can be accessed by picking any of your existing html items such as a button and using inspect element to add the attribute code

onclick = "javascript:alert(password);"

Resetting the variable password to null will keep your password information safe.

var password = $('#password').val();
//do what you want to do with variable password
password = null;

Answer 2

No it isn't. Every local variable is deleted after the end of a function.

Answer 3

There was an issue with iE and circular references involving DOM elements. This was usually created when attaching listeners as follows:

function doStuff() {
   var el = document.getElementById('someID');
   el.onclick = function() {
     // has closure to el
   };

   // remove reference to element
   el = null;
}

When doStuff ia called, the anonymous function attached to the element has a closure back to the element - a circular reference. In older versions of IE this caused a memory leak so the solution was to set el to null (or anything other than el) to break the circular reference after the assignment to el.onclick.

The second reason to use it is similar - if a function has a closure that keeps a reference a large object that might otherwise be garbage collected, then it may be useful to remove the reference so that the object can be cleaned up:

var someFunction = (function() {
  var x = reallyBigObject;
  // do stuff that uses reallyBigObject

  // Remove reference to reallyBigObject if it's no longer required
  x = null;

  return function() {
    // closure to x is unavoidable, but reference to reallyBigObject isn't required
  }
}());

So if the function returned to someFunction doesn't actually need to reference reallyBigObject, then the reference can be removed so the closure doesn't keep it from being garbage collected unnecessarily.

Note that you can't prevent the closure to variables in scope, but you can modify their values.

This stuff usually isn't much of an issue unless you are keeping pages open for a long time and doing lots of AJAX and adding and removing lots of DOM nodes. But it's probably a good habit to remove references to objects in closures where they aren't needed.

Answer 4

It wouldn't make any difference setting a local variable to null at the end of the function because it would be removed from the stack when it returns anyway.

However, inside of a closure, the variable will not be deallocated.

var fn = function() {

   var local = 0;

   return function() {
      console.log(++local);
   }

}

var returned = fn();

returned(); // 1
returned(); // 2

jsFiddle.

When the inner function is returned, the outer variable's scope will live on, accessible to the returned inner function.