PDA

View Full Version : Class code organization (procedural, alphabetical)



mjlecomte
25 Nov 2008, 8:31 AM
Curiosity finally got the better of me enough to post this question. This question is pretty basic for any programming language I guess. But for argument, let's assume this is limited to javascript code.

Any lessons learned on how to organize your call as far as placement within a class? Do you organize your methods/properties alphabetically, or group them by purpose?

What partly motivated this question was when I was reviewing the source for one of Ext's classes and seemingly saw no rhyme / reason for the code organization. It wasn't alphabetical, nor did I pick up on a pattern where similar related (procedural sequence) code was grouped (for example maybe hide/show or create/destroy, or whatever).

Some IDE's will give you an outline view of your code which is typically arranged alphabetically anyway. So I could see where arranging alphabetical isn't strictly necessary, but it still seems to make it easier to know if I'm looking at the show() method and I need to find a create() method it will be somewhere above where I'm looking.

Sorry for the insane question, but I figured there must be some kind of logic to the code organization ExtJS was using.

Just for argument/discussion you could look at Ext.util.MixedCollection.



Ext.util.MixedCollection = function(allowFunctions, keyFn){
this.items = [];
this.map = {};
this.keys = [];
this.length = 0;
this.addEvents("clear", "add", "replace", "remove", "sort");
this.allowFunctions = allowFunctions === true;
if (keyFn) {
this.getKey = keyFn;
}
Ext.util.MixedCollection.superclass.constructor.call(this);
};
Ext.extend(Ext.util.MixedCollection, Ext.util.Observable, {
allowFunctions: false,
add: function(key, o){

},
getKey: function(o){

},
replace: function(key, o){

},
addAll: function(objs){

},
each: function(fn, scope){

},
eachKey: function(fn, scope){

},
find: function(fn, scope){

},
insert: function(index, key, o){

},
remove: function(o){

},
removeAt: function(index){

},
removeKey: function(key){

},
getCount: function(){

},
indexOf: function(o){

},
indexOfKey: function(key){

},
item: function(key){

},
itemAt: function(index){

},
key: function(key){

},
contains: function(o){

},
containsKey: function(key){

},
clear: function(){

},
first: function(){

},
last: function(){

},
_sort: function(property, dir, fn){

},
sort: function(dir, fn){

},
keySort: function(dir, fn){

},
getRange: function(start, end){

},
filter: function(property, value, anyMatch, caseSensitive){

},
filterBy: function(fn, scope){

},
findIndex: function(property, value, start, anyMatch, caseSensitive){

},
findIndexBy: function(fn, scope, start){

},
createValueMatcher: function(value, anyMatch, caseSensitive){

},
clone: function(){

}
});

I guess I'll add a poll to this in case people just want to weigh in on what they do without posting.

harley.333
25 Nov 2008, 9:42 AM
I think you need to add some options to the poll.

Generally, I alphabetize. But for larger classes (like Ext.Element), I tend to organize by common functionality. Often times, I group the "private" methods together (separate from the public methods).