Architecture for creating a JavaScript framework -

around 1 year ago started web system on time has grown quite bit. beginning goal build reusable code speed development of future projects, , has. every new project, reusable code previous taken , build upon it.

at moment, server side code clean, , there clear separation between "framework" (generic functionality) , project specific logic.

however, javascript has grown out of control. page specific javascript (button events, ajax calls, etc.) we've been using closures , the module pattern. javascript common files (the ones import in every page), full of functions no association between them beyond similarities on names.

because of i'm trying build sort of framework (easily reusable , maintainable code) encapsulating logic , functions have. should 1 "core" object , several optional "extensions". in separate files improve order of code. specifically, i'm trying achieve following:

• encapsulation of code prevent name collisions. comfortable private/public separation of closures.
• extendable functionality, open/close principle. tricky part here an extension might want access private method of core.

i've been reading lot on oo in javascript, , i've tried understand how jquery it, i'm still unable head around it. architectural side, seems should building module or service framework, ones i've found more complex want achieve.

if weren't tricky part mentioned earlier, simple $.extension() do, i'm stuck in how access core private method extension part. in short, question be: there recommended architecture in javascript build following example?

var framework = function () {     //private variable     var internalstate = 1;      //private method     var validstate = function () { ... }      //public methods     return {         commontask1: function () { ... },         commontask2: function () { ... }     } }();  framework.addmorefunctionality(function () {     var specificdata = '';      return {         extensionmethod: function () {             //tricky part here             if (core.validstate()) { ... }         }     } }()); 

just return function framework module.

return {     isvalidstate: function() { ... }     commontask1: function () { ... },     commontask2: function () { ... } } 

the isvalidstate function check internal state.

// isvalidstate function() {     if (validstate()) {         return true;     }      return false; } 

check if state valid calling core.isvalidstate(); not reference "private" variable inside framework core because functions returns bool , not direct reference objects.