Let’s look at how to use the built-in Array.sort method to sort an array of objects by date in descending or ascending order.

JavaScript sort array syntax

myArray.sort([compareFunction]);

As you can see above, the sort method takes in a single optional parameter called compareFunction. If you don’t supply a function, it converts each element to a string for comparison using code point.

var foo = [9, 30, 5, 'what', 'the'];
foo.sort(); // returns [30, 5, 9, 'the', 'what']

Notice anything weird? JavaScript sort converts each element to string and applies alphabetical sorting.

Implementing a custom compare function

Since sorting dates with string representations is not a great idea, we will implement the compareFunction for sorting arrays by date property.

The syntax is below:

function compare(firstElement, secondElement) {
  // must return a number
}

The compare function above must return a number. Depending on the number returned, JavaScript sort method will adjust the position of elements.

1. If the result is less than 0, firstElement comes first.
2. If the result is 0, it leaves firstElement and secondElement unchanged with respect to each other, but sorted with respect to all other elements.
3. If the result is greater than 0, secondElement comes first.

It is worth noting the function above ignores all undefined elements of the array.

By default, it places all undefined elements at the end after sorting the array.

Sort by date in ascending order

Having explored the sort method syntax, we apply sorting in descending order.

var friends = [
   { name: 'Middle-aged John', dateOfBirth: new Date(1995, 5, 19)},
   { name: 'Young John', dateOfBirth: new Date(2000, 1, 22)},
   { name: 'Old John', dateOfBirth: new Date(1990, 3, 10)},
];

friends.sort(function (a, b) {
  if (a.dateOfBirth > b.dateOfBirth) return 1;
  if (a.dateOfBirth < b.dateOfBirth) return -1;
  return 0;
});

console.log(friends);
// Prints in order: Old John, Middle-aged John, Young John

Sort by date in descending order

We can reverse the sort order simply by inverting the return value of the function.

var friends = [
   { name: 'Middle-aged John', dateOfBirth: new Date(1995, 5, 19)},
   { name: 'Young John', dateOfBirth: new Date(2000, 1, 22)},
   { name: 'Old John', dateOfBirth: new Date(1990, 3, 10)},
];

friends.sort(function (a, b) {
  if (a.dateOfBirth > b.dateOfBirth) return -1;
  if (a.dateOfBirth < b.dateOfBirth) return 1;
  return 0;
});

console.log(friends);
// Prints in order: Young John, Middle-aged John, Old John

Summary

We have just implemented JavaScript sort to order an array of objects by date property. We learned how to implement custom comparison using the sort method.

If you have any questions, feel free to drop a line below.

The post How to Sort Array of Objects by Date in JavaScript appeared first on onthecode.