home

Sorting an array of custom objects in JavaScript

November 2, 2011 · 2 comments

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.
Considering that, my custom sorting function looks like this:
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.

Related Posts

{ 2 comments… read them below or add one }

vsr November 2, 2011 at 7:02 PM

You could also return the difference from the custom sort function.
function eventSorter(a, b) { return a.start – b.start; }
:-D

Reply

Veera November 2, 2011 at 9:12 PM

yeah, that is evenShorter! :)

Reply

Leave a Comment

Previous post:

Next post: