CODEWITHSUNDEEP
javascriptcollections
hacksteak25
hacksteak25

Reputation: 2049

Best practice for ordering a collection of key/value pairs in javascript?

what would be an efficient (and userfriendly) way to realize the following in javascript/jQuery?

Depeding on the mime-type of a file, a callback should be executed. The callback is defined by the developer by providing a mime-type description with optional wildcards (e.g. text/javascript, text/*, */*) and the callback itself. There must be a specified order in which the declared types are matched against the given mime-type of the file. For example must text/plain have a higher priority than text/*.

Here some ideas:

Using a simple object

var handler = {
 'text/javascript' : callback0,
 'text/*' : callback1
}

This would be the most intuitive solution, but the ordering is not guaranteed.

Maintain two lists

var order = ['text/javascript', 'text/*'];
var handler = [callback0, callback1];

This is would be hard to maintain if there are more than two or three types and you are using anonymous functions as callbacks.

Adding an index by wrapping the callback into an object

var handler = {
  'text/javascript' : {index: 0, callback0},
  'text/*' : {index: 1, callback1}
};

... change thousands of index-properties when inserting an item at the beginning.

Using an array of arrays 

var handler = [
  ['text/javascript', callback0],
  ['text/*', callback1]
];

This might me more userfriendly than the others, but there is no direct access for known mime-types without iterating over the elements (this would be nice-to-have).

So there are some ways to do the thing I want, but what would be the right way (and why)? Maybe someone has a pattern?

Best, Hacksteak

Upvotes: 1

Views: 550

Answers (2)

Teddy
Teddy

Reputation: 18572

I would use the 'simple object' solution AND the order array form the 'maintain two lists' solution.

Iterate through the order array with a block of code that uses the handler simple object to do something that either breaks the loop or continues to the next loop iteration.

EDIT TO RESPOND TO A COMMENT

I agree with your comment. I would do something like this to make it just one variable:

var handlers = {
  handler: {
    'text/javascript': callback0,
    'text/*': callback1
  },
  order: ["text/javascript", "text/*"]
};

Although I would pick better names for the handlers variable and/or the handlers.handler property.

ANOTHER RESPONSE TO ANOTHER COMMENT

Maybe you should just modify handlers.handler and handlers.order one-mime-type-at-a-time:

var handlers = { handler: {}, order: [] }; // initialize as empty

// add 'text/javascript' mime type
handlers['text/javascript'] = callback0;
handlers.order.push('text/javascript');

// add 'text/*' mime type
handlers['text/*'] = callback1;
handlers.order.push('text/*');

That method fills a little repetitive, but should be easy to maintain in the future. If you want, you can write a function that adds a new property to handlers.handler and appends a new mime-type to handlers.order.

Upvotes: 2

kzh
kzh

Reputation: 20608

It seems that ordering on objects is in insertion order on most vendors, except for V8 which is true except for numerical indices. See the references below.

I probably wouldn't be doing any looping. I would probably do something like this:

var handler = {
    text: {
        javascript: callback0,
        '*': callback1
    },
    '*' : {
        '*': callback3
    }
};
var mime = 'whatevs/whatevs'.split('/');
var callback = handler[mime[0]][mime[1]] || handler['*']['*'];
callback();

References

  1. Iterating JavaScript object properties and arrays with for..in when ordering is important
  2. http://code.google.com/p/v8/issues/detail?id=164

Upvotes: 1

Related Questions