Currently I’m rewriting my Timelinr application entirely using JavaScript, thus replacing PHP which is now generating the timeline. In my code, I have an Event object which looks like this:
function Event(d1, d2, name) {
this.start = d1;
this.end = d2;
this.name = name;
}
When the user adds an event to the timeline, I create a new event object and push it to an array. But it is not guaranteed that the user will add events in any chronological order. So, when the array is modified, I should make sure that the list is sorted, ordered by event start date.
JavaScript array provides an inbuilt sort() method. But the default functionality is limited that it sorts by converting all the elements to strings. Obviously, this sorting isn’t enough for my custom object as I needed to sort the date.
The sort() method can accept a callback function which then determines the custom sorting order. This callback takes two parameters (a,b), compares them and finally returns a result based on the comparison.
- If it returns zero, then a and b won’t be swapped (sorted as they are equal).
- It it returns less than zero, then a will be placed before b in the list.
- Otherwise, a will be placed after b in the list.
function eventSorter(a, b) {
if (a.start == b.start) {
return 0;
} else {
return a.start < b.start ? -1 : 1;
}
}
itemsArray.sort(eventSorter);
which will then sorts an array based on the start date.

Hi! I'm Veera Sundar. I am a web application developer. I usually build the application end-to-end using Java on the back-end and JavaScript on the front end. 
{ 2 comments… read them below or add one }
You could also return the difference from the custom sort function.
function eventSorter(a, b) { return a.start – b.start; }
yeah, that is evenShorter!