JavaScript - Sort JS Arrays of Objects by Date Key
Last Updated :
13 Nov, 2024
Improve
The following approaches can be used to sort the array of objects by Date as Key
Using Array.sort() with Comparison Function
Use the comparison function to sort the array of objects (complex array).
const arr = [
{ name: 'Geeks', date: '2022-03-15' },
{ name: 'Abc', date: '2022-03-12' },
{ name: 'GFG', date: '2022-03-20' },
{ name: 'G4G', date: '2021-03-20' }
];
arr.sort((a, b) => a.date - b.date);
console.log(arr);
Output
[
{ name: 'Geeks', date: '2022-03-15' },
{ name: 'Abc', date: '2022-03-12' },
{ name: 'GFG', date: '2022-03-20' },
{ name: 'G4G', date: '2021-03-20' }
]
Using JS Date() in Comparison Function
Convert the date string to JS Date Objects.
const arr = [
{ name: 'Geeks', date: '2022-03-15' },
{ name: 'Abc', date: '2022-03-12' },
{ name: 'GFG', date: '2022-03-20' },
{ name: 'G4G', date: '2021-03-20' }
];
arr.sort((a, b) => new Date(a.date) - new Date(b.date));
console.log(arr);
Output
[
{ name: 'G4G', date: '2021-03-20' },
{ name: 'Abc', date: '2022-03-12' },
{ name: 'Geeks', date: '2022-03-15' },
{ name: 'GFG', date: '2022-03-20' }
]
Using Date.getTime() in Comparison Function
Date.getTime() method returns the time in miliseconds, that can be used to compare and sort he objects.
const arr = [
{ name: 'Geeks', date: '2022-03-15' },
{ name: 'Abc', date: '2022-03-12' },
{ name: 'GFG', date: '2022-03-20' },
{ name: 'G4G', date: '2021-03-20' }
];
arr.sort((a, b) => new Date(a.date).getTime() - new Date(b.date).getTime());
console.log(arr);
Output
[
{ name: 'G4G', date: '2021-03-20' },
{ name: 'Abc', date: '2022-03-12' },
{ name: 'Geeks', date: '2022-03-15' },
{ name: 'GFG', date: '2022-03-20' }
]
Using Date.toISOString() method in Comparison Function
Date.toISOString() method converts the date to ISO Format string, we can compare the strings using localeCompare() method to sort the objects.
const arr = [
{ name: 'Geeks', date: new Date('2022-03-15') },
{ name: 'Abc', date: new Date('2022-03-12') },
{ name: 'GFG', date: new Date('2022-03-20') },
{ name: 'G4G', date: new Date('2021-03-20') }
];
arr.sort((a, b) =>
a.date.toISOString().localeCompare(
b.date.toISOString()
));
console.log(arr);
Output
[
{ name: 'G4G', date: 2021-03-20T00:00:00.000Z },
{ name: 'Abc', date: 2022-03-12T00:00:00.000Z },
{ name: 'Geeks', date: 2022-03-15T00:00:00.000Z },
{ name: 'GFG', date: 2022-03-20T00:00:00....Output
[
{ name: 'G4G', date: 2021-03-20T00:00:00.000Z },
{ name: 'Abc', date: 2022-03-12T00:00:00.000Z },
{ name: 'Geeks', date: 2022-03-15T00:00:00.000Z },
{ name: 'GFG', date: 2022-03-20T00:00:00.000Z }
]Using Moment.js Methods in Comparison Function
Moment.js is a JavaScript library for Date manupulation and formatting. The moment().diff() method is used for comparing the dates in comparison function.
// Import moment.js
const moment = require('moment');
const arr = [
{ name: 'Geeks', date: '2022-03-15' },
{ name: 'Abc', date: '2022-03-12' },
{ name: 'GFG', date: '2022-03-20' },
{ name: 'G4G', date: '2021-03-20' }
];
// Sort array by date using moment.js
arr.sort((a, b) => moment(a.date).diff(moment(b.date)));
console.log(arr);
Output
[
{ name: 'G4G', date: '2021-03-20' },
{ name: 'Abc', date: '2022-03-12' },
{ name: 'Geeks', date: '2022-03-15' },
{ name: 'GFG', date: '2022-03-20' }
]Using dayjs for Date Sorting in Comparison Function
Day.js is a minimalist JavaScript library that parses, validates, manipulates, and displays dates. The dayjs().diff() method can be used to sort arrays of objects by date values efficiently.
// Require dayjs
const dayjs = require('dayjs');
const arr = [
{ name: 'Geeks', date: '2022-03-15' },
{ name: 'Abc', date: '2022-03-12' },
{ name: 'GFG', date: '2022-03-20' },
{ name: 'G4G', date: '2021-03-20' }
];
// Sort array by date using dayjs
arr.sort((a, b) => dayjs(a.date).diff(dayjs(b.date)));
console.log(arr);
Output
[
{ name: 'G4G', date: '2021-03-20' },
{ name: 'Abc', date: '2022-03-12' },
{ name: 'Geeks', date: '2022-03-15' },
{ name: 'GFG', date: '2022-03-20' }
]
