开发者

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 (o开发者_运维百科f 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?


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


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.


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.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜