Hi,

I see that jQuery is heavily based on closure-style coding. I'm not too experienced in js performance semantics and would like to hear your thoughts. After reading about closures a bit more, it seems to be inefficient when an object is created many times; where the closure functions are created in the constructor.

However, in my scenario, I wish to create one object only once, but frequently call the routines in it. Any thoughts of performance comparisons for the following implementations:


(Although my sample is to simple to justify e.g, using closures, the real program is more complex)



#1: Closure implementation:

1. 
   

   function controlPanel() {
      var numUsers = 0;
   
    return {
       incrementUsers: function() { this.numUsers++; },
    decrementUsers: function() { this.numUsers--; }
    }
   }
   
   // create a control panel once, but frequently call it's methods. 
   var c = new controlPanel();
   
   
   
   
   
   
   
   
   
   
   

   
   

       


#2: Using prototype (json syntax)

1. function controlPanel() {
      var numUsers = 0;
   }
   
   controlPanel.prototype= {
       incrementUsers: function() { this.numUsers++; },
    decrementUsers: function() { this.numUsers--; }
    }        
   }
   
   var c = new controlPanel();
   
   
   
   
   
   
   
   
   
   
   

#3: Using prototype (verbose syntax)

1. function controlPanel() {
      var numUsers = 0;
   }
   
   controlPanel.prototype.incrementUsers = function {
    return this.numUsers++;
   }
   
   controlPanel.prototype.decrementUsers = function { 
    return this.numUsers--;
   }
   
   
   var c = new controlPanel();
   
   
   
   
   
   
   
   
   
   
   
   
   
   

#4: EDIT - I found another way of design as well (set aside that it's defined in the global scope)
This would be really interesting to compare to the prototype approach when creating lots of object instances.

1. function controlPanel() {
      var numUsers = 0;     
    this.incrementUsers = _inc;
    this.decrementUsers = _dec; 
   }
   
   function _inc{ return this.numUsers++; }
   function _dec{ return this.numUsers--; }
   
   var c = new controlPanel();
   
   
   
   
   
   
   
   
   

I'm not looking to use regular functions since I don't want to clutter my public space unnecessary variables. But feel free to offer any other efficient way of grouping logic functions.


// Johan


EDIT: Shortened the examples a bit.