StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POShould I use methods or subclasses? If that makes sense
text
Body
copied!<h2>A Little Background...</h2> <p>I have an an object called <code>SineMacula</code> which houses many methods for creating form elements and making these form elements do things on a page.</p> <p>Firstly, when the page loads, a method called <code>setFields()</code> is called which loops through all the fields on a page and sets them appropriately <strong><em>i.e. autocomplete, checkbox etc...</em></strong></p> <p>The code for <code>setFields()</code> looks like this:</p> <pre><code>/** * Set Fields * This function will set all fields * * The options: * - fields: the fields selector to loop through * * @param object options The field options */ SineMacula.prototype.setFields = function (options){ // Set the defaults for the fields var options = $.extend({ fields: '.field', // Define the default field selector },options); // Loop through the fields and set the events $(options.fields).each(function(){ // Set the field events SineMacula.setBlur($(this)); SineMacula.setFocus($(this)); SineMacula.setToggleLabel($(this)); // If the field is a checkbox then set it if($(this).parent().hasClass('checkbox')){ SineMacula.setCheckbox($(this).parent()); } // If the field is an autocomplete then set it if($(this).parent().hasClass('autocomplete')){ SineMacula.setDropdown($(this).parent(),{source:$(this).attr('data-source')}); } // etc... }); }; </code></pre> <p><em><strong>Most of the code above can be ignored, but I have inserted all of it so that you can see exactly what I am doing.</em></strong></p> <h2>My Question</h2> <p>I have quite a few methods of the <code>SineMacula</code> object such as <code>setCheckbox()</code>, <code>setDropdown()</code>...</p> <p>What I would like to know is, should I be treating these methods as objects in themselves?</p> <p>So should my code look like this instead:</p> <pre><code>if($(this).parent().hasClass('autocomplete')){ new SineMacula.dropdown($(this).parent(),{source:$(this).attr('data-source')}); } </code></pre> <p><em><strong>Notice the <code>new</code> keyword before calling the <code>dropdown()</code> method.</em></strong></p> <p>Is this a better method of working things? Will be use less memory etc?</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload