Best way to structure my objects and functions

Best way to structure my objects and functions

Hi,

I am building a fairly complex thing which revolves around a floating "inspector" on the screen. This inspector has various associated methods such as hide(), show(), initialise(), loadObject() etc

I am a bit confused about how I should be structuring my code. Should I use:

  1. var inspector = function() {
        this.methodOne = function() {};
        this.methodTwo = function() {};
        // etc
    }
or
  1. inspector();
  2. function inspector() {
  3.     this.methodOne = function() {};
  4.     this.methodTwo = function() {};
  5.     // etc
  6. }
    Will either option allow me to do the following?
    1. inspector.methodOne();
    2. inspector.methodTwo();

    The inspector markup in its most basic form is something like
    1. <div id="inspector">
    2.     <h2>Inspector</h2>
    3.     <div id="region-one"></div>
    4.     <div id="region-two"></div>
    5.     <div id="region-three"></div>
    6. </div>
    Inside my "inspector" function should I put all the above markup into a jQuery object like:
    1. this.inspectorMarkup = $('<div all-the-inspector-markup etc>');
    2. this.addMarkup = function() {
    3.     $('body').append(this.inspectorMarkup);
    4. }
    or should all the inspector's methods be attached to a jQuery object like this
    1. inspector = $('<div all-the-inspector-markup etc>');
    2. inspector.initialise = function() {
    3.     $('body').append(this);
    4. }
    5. inspector.methodOne = function() {}
    As you can probably tell I'm in need of some wise directions :)

    Thanks,
    Jeff




      • Topic Participants

      • jeff