Question

I am updating some code that was created by another developer and am noticing that there are a lot of, what I can best describe as, functions inside functions and the whole object is set to a variable.

For example:

var spellcheck = {
checkone: function() {      
    <....>
    spellcheck.jspspellcheck.startSpellCheck( "/SpellChecker/", $(e.target).parent().prev('input:enabled, textarea:enabled') );

},  
jspspellcheck: {
    <....>
    startSpellCheck: function(baseUrl,elements){
        <....>          
        spellcheck.jspspellcheck.openCenteredWindow( );
    }
}
}

Obviously the above code is just a sample, but it does illistrate how a lot of the jQuery is written.

From the dot notation I it looks like it is making use of OO type practices, however having “functions” inside other functions gets quite confusing (at least to me). Basically, should I try and refactor this code into different named functions or am I missing something that is a best practice?

Answer 1

That wouldn’t really be “refactoring”, it’d be “moving”. Not that restructuring some of it wouldn’t be good–there’s just no way to tell from the posted code.

But why would you want to? They’re in there to keep them out of the global namespace (one way of modularizing JS code).