title: Pattern for Javascript Module Pattern and Sub-Module Initialization
body: <p>I am starting up a new project and I am reviewing my best-practices to try to prevent any problems, and also to see what bad habits I have gotten into.</p>
  
  <p>I am not terribly pleased with how I am handling initialization sequences in Javascript using the module / submodule pattern.</p>
  
  <p>Let's say, my code ends up with something like</p>
  
  <pre><code>FOO.init()
  FOO.module1.init()
  FOO.module2.init()
  FOO.module3.init()
  FOO.module4.init()
  </code></pre>
  
  <p>at the global scope.</p>
  
  <p>I am essentially doing (error checking and details omittied for brevity):</p>
  
  <pre><code>var FOO = (function (me) {
      me.init = function () {
          for (var i in me.inits) {
              me.inits[i]();
          }
      }
  
      return me; 
  }(FOO || {}));
  
  var FOO = (function (parent) {
      var me = parent.module1 = parent.module1 || {};
  
      me.init = function () {
      }
  
      parent.inits.push(me.init);
  
      return parent;
  }(FOO || {}));
  
  $(document).ready(FOO.init);
  </code></pre>
  
  <p>for initialization.</p>
  
  <p>I know I have read up on this before, but I can't come up with the right search terms to find the articles now.  Is there a well thought out and tested pattern that handles initialization in sitiation like this?</p>
  
  <p>Thanks.</p>
  
  <p>EDIT: Upon re-reading this, I think a little context will inform answers.</p>
  
  <p>In my case, each module / submodule is in its own file.  The base module defines the basic functionality of the site, and sub-modules enable different features.  For example, a sub-module may wire up auto-completion on a search box, and another may turn a static header image into a rotating banner.  Sub-modules are enabled/disabled by the CMS, so I really do want to divorce explicit calls inside the base module so everything can be managed by the CMS.  I also that there are CMS specific ways to accomplish this, but I looking for a generic Javascript pattern for doing this to provide consistency and resuablity between projects that may use a different CMS.</p>