Typescript sort array of objects by date descending

Are you searching for “typescript sort array of objects by date descending”? In this tutorial, I will explain how to sort an array of objects by date descending in Typescript.

To sort an array of objects by date in descending order in TypeScript, use the Array.sort() method. Define your array with date properties, and then apply the sort method with a custom comparator function: array.sort((a, b) => b.date.getTime() – a.date.getTime());. This approach effectively sorts your array objects based on the date property in descending order.

Sort an array of objects by date descending in Typescript

As a developer, I often encounter scenarios where I need to sort an array of objects by date in TypeScript. Let us check different methods to sort an array of objects by date in descending order using TypeScript.

Method 1: Using the Array.sort() Function

The Array.sort() function is a versatile method in JavaScript, and TypeScript inherits this functionality. To sort an array of objects by date, we first need to define our object structure.

interface MyObject {
  date: Date;
  // other properties
}

let myArray: MyObject[] = [
    { date: new Date('2024-11-10') },
    { date: new Date('2024-11-12') },
    { date: new Date('2025-11-11') }
  ];

To sort this array, we’ll use the Array.sort() function:

myArray.sort((a, b) => b.date.getTime() - a.date.getTime());

Here is the complete code:

interface MyObject {
    date: Date;
    // other properties
  }
  
  let myArray: MyObject[] = [
    { date: new Date('2024-11-10') },
    { date: new Date('2024-11-12') },
    { date: new Date('2025-11-11') }
  ];
  
  myArray.sort((a, b) => b.date.getTime() - a.date.getTime());
  
  console.log(myArray);

Output:

[
  { date: 2025-11-11T00:00:00.000Z },
  { date: 2024-11-12T00:00:00.000Z },
  { date: 2024-11-10T00:00:00.000Z }
]

Check out the screenshot below:

typescript sort array of objects by date descending

Method 2: Using moment.js for More Complex Date Formats

If you’re working with complex date formats, using a library like moment.js can be beneficial. First, you’ll need to install moment.js:

npm install moment

Now, let’s sort an array using moment.js; below is the complete code:

import moment from 'moment';

interface MyObject {
  date: string; // Notice the change to string type
  // other properties
}

let myArray: MyObject[] = [
  { date: '2025-11-10' },
  { date: '2024-11-12' },
  { date: '2024-11-11' }
];

myArray.sort((a, b) => moment(b.date).diff(moment(a.date)));

Method 3: Using Sort Custom Function

You can also write a custom sort function. This method is particularly useful if you need to handle null or undefined values gracefully. Here is the complete code:

interface MyObject {
  date: Date | null; // Allowing null for date
  // other properties
}

function compareDates(a: MyObject, b: MyObject): number {
  if (!a.date) return 1; // null dates come last
  if (!b.date) return -1;
  return b.date.getTime() - a.date.getTime();
}

let myArray: MyObject[] = [
  { date: new Date('2023-11-10') },
  { date: null }, // Example of a null date
  { date: new Date('2023-11-12') },
  { date: new Date('2023-11-11') }
];

myArray.sort(compareDates);

console.log(myArray);

In this code, the custom compareDates function sorts the array while handling null date values effectively in Typescript.

See also  How to check if a key exists in a dictionary in typescript?

Output:

[
  { date: 2025-11-10T00:00:00.000Z },
  { date: 2024-11-12T00:00:00.000Z },
  { date: 2024-11-11T00:00:00.000Z },
  { date: null }
]

Check out the screenshot for the output:

typescript sort array of objects by date descending

Conclusion

Sorting an array of objects by date in descending order in TypeScript can be achieved through several methods, each catering to different requirements. Whether you opt for the straightforward Array.sort() method, leverage moment.js for complex date formats, or implement a custom comparator, TypeScript provides the flexibility and robustness needed for efficient data management.

You may also like:

>