Sort an Array of Objects by Date Property in Javascript

Very common requirement developers encounter while working with javascript objects and arrays is to sort an array of objects based on Date property value. This article demonstrates easy ways to sort an array of objects by date property in ascending and descending order using various example illustrations.

Table of Contents:

Javascript’s sort() method sorts all the array elements and returns the sorted array.

Sort an Array of Objects by Date Property

Example:-

Sort the below array of objects based on the dateOfSubmission property

[ { personName: ‘Ruby’, dateOfSubmission: new Date(‘2021-11-25’)}, { personName: ‘Eva’, dateOfSubmission: new Date(‘2021-10-31’)}, { personName: ‘Paul’, dateOfSubmission: new Date(‘2021-11-15’)}]

Code:-

var myArray = [
  { personName: 'Ruby', dateOfSubmission: new Date('2021-11-25')},
  { personName: 'Eva', dateOfSubmission:  new Date('2021-10-31')},
  { personName: 'Paul', dateOfSubmission:  new Date('2021-11-15') }
];
//arrow function to define the sort based on dateOfSubmission
//print the result on console
console.log(myArray.sort((obj1, obj2) => obj1.dateOfSubmission - obj2.dateOfSubmission))

Output:-

[
  { personName: 'Eva', dateOfSubmission: 2021-10-31T00:00:00.000Z },
  { personName: 'Paul', dateOfSubmission: 2021-11-15T00:00:00.000Z },
  { personName: 'Ruby', dateOfSubmission: 2021-11-25T00:00:00.000Z }
]

Explanation:-

In the above code, we are passing the arrow function within the sort() method to sort the array objects based on date. This arrow function does a subtraction between passed date property values and returns negative, positive or zero.

Sort an Array of Objects by Date Property when Date is String

Example:-

Sort the below array of objects based on the dateOfSubmission property

[ { personName: ‘Ruby’, dateOfSubmission:”Nov 24 2021″}, { personName: ‘Eva’, dateOfSubmission: “Oct 31 2021”}, { personName: ‘Paul’, dateOfSubmission: “Nov 15 2021” }]

Code:-

var myArray = [
  { personName: 'Ruby', dateOfSubmission: "Nov 24 2021"},
  { personName: 'Eva', dateOfSubmission: "Oct 31 2021"},
  { personName: 'Paul', dateOfSubmission: "Nov 15 2021" }
];
//compare function passed to define the sort based on dateOfSubmission
// Turn your Strings into Dates, and then subtract them
// to get a value that is either negative, positive, or zero.
console.log(myArray.sort(function compare(obj1, obj2){return new Date(obj1.dateOfSubmission) - new Date(obj2.dateOfSubmission)}))

Output:-

[
  { personName: 'Eva', dateOfSubmission: 'Oct 31 2021' },
  { personName: 'Paul', dateOfSubmission: 'Nov 15 2021' },
  { personName: 'Ruby', dateOfSubmission: 'Nov 24 2021' }
]

Explanation:-

In the above code, we pass the compare(obj1, obj2) function within the sort() method to sort the array objects based on date. This function first converts the Strings to Date and then does a subtraction between obj1.dateOfSubmission and obj2.dateOfSubmission to return negative or positive or zero.

Sort an Array of Objects by Date Property Descending

Example:-

Sort the below array of objects based on the dateOfSubmission property in descending order

[ { personName: ‘Ruby’, dateOfSubmission:”Nov 24 2021″}, { personName: ‘Eva’, dateOfSubmission: “Oct 31 2021”}, { personName: ‘Paul’, dateOfSubmission: “Nov 15 2021” }]

Code:-

var myArray = [
  { personName: 'Ruby', dateOfSubmission: "Nov 24 2021"},
  { personName: 'Eva', dateOfSubmission: "Oct 31 2021"},
  { personName: 'Paul', dateOfSubmission: "Nov 15 2021" }
];
//compare function passed to define the sort based on dateOfSubmission
// Turn your Strings into Dates, and then subtract them
// to get a value that is either negative, positive, or zero.
console.log(myArray.sort(function compare(obj1, obj2){return new Date(obj2.dateOfSubmission) - new Date(obj1.dateOfSubmission)}))

Output:-

[
  { personName: 'Ruby', dateOfSubmission: 'Nov 24 2021' },
  { personName: 'Paul', dateOfSubmission: 'Nov 15 2021' },
  { personName: 'Eva', dateOfSubmission: 'Oct 31 2021' }
]

Explanation:-

Here, we are using the same compare() function to sort the dates in descending order.

I hope this article helped you sort an array of objects by date property value in javascript. Good Luck !!!

Advertisements

Leave a Comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Scroll to Top