JavaScript messy code in large projects with jquery etc?

Question

Calling the javascript gurus out there. Basically my question is regarding how you structure your code, both visually and for functionality for example do you wrap everything in objects using this structure:

var myapp={
  binds:function(){
    //put some event listeners for jquery etc...
  },
  otherfunc:function(){
   //do some other thing
  },
  init:function(){
   //call myapp.binds and other functions and other stuff to intialize your app.
  }
};

Then finally

$(document).ready(myapp.init);

The thing is with a structure like this I think JSLint complains doesn't it? Whats the pros and cons using a structure like this or is there a generally better way to structure your code? Do you follow a certain pattern from $(document).ready(call) to putting all your event listeners and "initializing" your app, do you use separate objects for methods and variables?

I also think "visually" if you have a very large webapp this structure eventually looks very messy, but maybe it's just me I don't know, any input is appreciated thanks.

Answer 1

Using Inheritance Patterns to Organize Large jQuery Applications

explain in detail and with better practice by Alex

http://alexsexton.com/?p=51

its very very well explain, must see

other links

• How To Manage Large jQuery Apps 5 months ago