CODEWITHSUNDEEP
javascriptfunctionclosures
Parag
Parag

Reputation: 963

Javascript global context’s variable object vs function activation object

Here are two samples of js code:

A. function _foo is defined within the global context

  function _foo(){ //some code here
  }

  //... some unrelated code here

  var foo = function(){
    var result = _foo();
    return result;
  }

B. function _foo is defined within the function context

var foo = function(){
  function _foo(){ //some code here 
  }

  var result = _foo();
  return result;
};

Which one of them is a better programming practice in terms of memory management? Since the function foo will be called many times in the application, is it better to keep _foo in the global context (of the app) and not create it within the function context everytime foo is called? Or since _foo will be (mostly) used inside foo, it makes sense to keep it part of the activation object?

Upvotes: 2

Views: 2299

Answers (3)

ricosrealm
ricosrealm

Reputation: 1636

Try an create your functions on the global context and use closure functions as asynchronous callbacks specific to the original functional request. You can potentially get into nasty memory leaks with too many anonymous function calls, because javascript will hold onto the top level variables that you use within the closure.

You may also want to use closure functions if you're trying to design in an OO style for private members. Do some Google/Stackoverflow searches on 'object oriented javascript' and your get more design help on that particular topic.

A quote From MDN:

https://developer.mozilla.org/en/JavaScript/Reference/Functions_and_function_scope

Closures can use up a lot of memory. The memory can be freed only when the returned inside is no longer accessible... Because of this inefficiency, avoid closures whenever possible, i.e. avoid nesting functions whenever possible.

Again, considering OO design is good... wrapping your functions into an object so that you can call them statically or via an object reference is a good design as well.

Upvotes: 0

Raynos
Raynos

Reputation: 169511

C: Caching

var foo = (function(){
  function _foo(){ //some code here 
  }
  return function() {
    var result = _foo();
    return result;
  }
}());

Foo is immediately executed and the function _foo is only declared once.

In modern browsers this is 5% slower then a "global" function.

Relevant Benchmark

Upvotes: 4

Mutation Person
Mutation Person

Reputation: 30520

To answer your question directly, if you're going to have to instantiate an object of foo every time that you want to call it, then declaring it at global scope would certainly be a faster alternative.

However, in JavaScript there will almost certainly be quicker wins from a performance perspective, most often pertaining to DOM interaction.

In these sorts of examples, I would recommend you stick with best programming practice. What would you do if this were C#, Java or some other more strongly-typed language? Well, you wouldn't be able to declare a global function, so you would put it in a class, either as a static method, or as a public method:

var foo = function(){};

//static method
foo._foo = function(){
    alert("_foo");
};

//public method
foo.prototype._foo2 = function(){
    alert("_foo2");
};

//calling static method
foo._foo();

//instantiating and calling public method:
var f = new foo();
f._foo2();

//note: this won't work (as we would expect!)
foo._foo2();

Most things like this are a trade-off, favouring style and structure here over performance is a good one.

Upvotes: 1

Related Questions