Recently, I was working on a project that required me to extract the day of the month from a date in TypeScript. This is a common requirement when building date-related features like calendars, scheduling applications, or any system that needs to parse dates.
In this tutorial, I will show you several methods to extract the day of the month in TypeScript.
Method 1 – Using the getDate() Method
The simplest way to get the day of the month in TypeScript is by using the built-in getDate() method of the Date object. Here is an example.
function getDayOfMonth(date: Date): number {
return date.getDate();
}
// Example usage
const today = new Date(); // Current date
const dayOfMonth = getDayOfMonth(today);
console.log(`Today is the ${dayOfMonth}${getDaySuffix(dayOfMonth)} day of the month`);
// Helper function to add appropriate suffix (st, nd, rd, th)
function getDaySuffix(day: number): string {
if (day > 3 && day < 21) return 'th';
switch (day % 10) {
case 1: return 'st';
case 2: return 'nd';
case 3: return 'rd';
default: return 'th';
}
}This method is perfect for simple applications where you just need the numeric day. The getDate() method returns a number between 1 and 31, representing the day of the month.
You can see the exact output in the screenshot below:
Check out Create a Date from Year, Month, and Day in TypeScript
Method 2 – Using Moment.js Library
If you’re already using Moment.js in your project, you can leverage its powerful date manipulation capabilities:
import moment from 'moment';
function getDayOfMonth(date: Date | string): number {
return moment(date).date();
}
// Example usage
const independenceDay = new Date(2025, 6, 4); // Month is 0-indexed (6 = July)
const dayOfMonth = getDayOfMonth(independenceDay);
console.log(`Independence Day is celebrated on the ${dayOfMonth}th of July`);Moment.js provides a clean API for working with dates. The date() method is equivalent to JavaScript’s native getDate().
Read Add Months to a Date in TypeScript
Method 3 – Using date-fns Library
The date-fns library is a modern alternative to Moment.js, offering tree-shakable imports and immutable date operations:
import { getDate, format } from 'date-fns';
function getDayOfMonth(date: Date): number {
return getDate(date);
}
// Example usage
const thanksgiving = new Date(2025, 10, 27); // November 27, 2025 (Thanksgiving is the 4th Thursday of November)
const dayOfMonth = getDayOfMonth(thanksgiving);
// You can also format the full date nicely
const formattedDate = format(thanksgiving, "MMMM do, yyyy");
console.log(`Thanksgiving falls on the ${dayOfMonth}th of November in 2025`);
console.log(`Formatted date: ${formattedDate}`);Date-fns is my personal preference for date manipulation in TypeScript projects due to its modern approach and excellent TypeScript support.
Check out Get the Current Date in TypeScript
Method 4 – Using Intl.DateTimeFormat API
If you need to display the day in a localized format, the native Intl.DateTimeFormat API is an excellent choice:
function getLocalizedDayOfMonth(date: Date, locale: string = 'en-US'): string {
return new Intl.DateTimeFormat(locale, { day: 'numeric' }).format(date);
}
// Example usage
const newYearsDay = new Date(2025, 0, 1); // January 1st, 2025
console.log(`New Year's Day (US format): ${getLocalizedDayOfMonth(newYearsDay)}`);
console.log(`New Year's Day (French format): ${getLocalizedDayOfMonth(newYearsDay, 'fr-FR')}`);This method is particularly useful for applications targeting international users, as it respects different date formatting conventions.
Check out How to Set a Date Value to Null in TypeScript
Method 5 – Parsing from Date Strings
Sometimes you might need to extract the day from a date string:
function getDayFromString(dateString: string): number {
const date = new Date(dateString);
// Check if date is valid
if (isNaN(date.getTime())) {
throw new Error('Invalid date string');
}
return date.getDate();
}
// Example usage
try {
const laborDay = getDayFromString('2025-09-01'); // Labor Day is the first Monday of September, 2025 is on Sep 1
console.log(`Labor Day is on the ${laborDay}st of September in 2025`);
// This would throw an error
// const invalidDay = getDayFromString('not-a-date');
} catch (error) {
console.error((error as Error).message);
}This method is useful when working with date strings from APIs or user inputs.
You can see the exact output in the screenshot below:
Using TypeScript with Date Manipulation
When working with dates in TypeScript, you get the benefit of strong typing. Here’s how you might use TypeScript features to make your date handling more robust:
// Define a type for date inputs
type DateInput = Date | string | number;
// Function to get day of month that accepts various input types
function getDayOfMonth(input: DateInput): number {
const date = new Date(input);
// Validate the date
if (isNaN(date.getTime())) {
throw new TypeError('Invalid date input');
}
return date.getDate();
}
// Example with type checking
interface HolidayEvent {
name: string;
date: DateInput;
isPublicHoliday: boolean;
}
const americanHolidays: HolidayEvent[] = [
{ name: 'Independence Day', date: '2025-07-04', isPublicHoliday: true },
{ name: 'Thanksgiving', date: new Date(2025, 10, 27), isPublicHoliday: true }, // Nov 27, 2025
{ name: 'Black Friday', date: new Date(2025, 10, 28).getTime(), isPublicHoliday: false }, // Nov 28, 2025
];
americanHolidays.forEach(holiday => {
const day = getDayOfMonth(holiday.date);
console.log(`${holiday.name} falls on day ${day} of the month.`);
});TypeScript helps catch errors early and makes your code more maintainable, especially when dealing with complex date operations.
Handling Edge Cases
When working with dates, it’s important to handle edge cases properly:
function getSafeDayOfMonth(input: unknown): number {
// Default to current date if no input
if (input === undefined || input === null) {
return new Date().getDate();
}
const date = new Date(input as any);
// Check if date is valid
if (isNaN(date.getTime())) {
console.warn('Invalid date input, defaulting to current day');
return new Date().getDate();
}
return date.getDate();
}
// Example usage with edge cases
console.log(getSafeDayOfMonth('2025-12-25')); // Christmas Day 2025
console.log(getSafeDayOfMonth(null)); // Today's day
console.log(getSafeDayOfMonth('invalid-date')); // Today's day with warningHandling edge cases gracefully enhances the robustness of your applications, particularly when interacting with user inputs.
Performance Considerations
If you’re extracting the day of the month in a performance-critical context, such as processing thousands of dates, consider these performance tips:
// Most efficient: Direct usage of getDate()
function fastGetDay(date: Date): number {
return date.getDate();
}
// Benchmarking different methods
function benchmarkDayExtraction(): void {
const iterations = 1000000;
const testDate = new Date();
console.time('Native getDate');
for (let i = 0; i < iterations; i++) {
fastGetDay(testDate);
}
console.timeEnd('Native getDate');
// Add other methods for comparison
}
// Run benchmark
// benchmarkDayExtraction();The native getDate() method is typically the most performant approach, so prefer it when processing large amounts of data.
I hope you found this article helpful. In this tutorial, I have explained how to extract the day of the month in TypeScript using various methods.
I am Bijay Kumar, a Microsoft MVP in SharePoint. Apart from SharePoint, I started working on Python, Machine learning, and artificial intelligence for the last 5 years. During this time I got expertise in various Python libraries also like Tkinter, Pandas, NumPy, Turtle, Django, Matplotlib, Tensorflow, Scipy, Scikit-Learn, etc… for various clients in the United States, Canada, the United Kingdom, Australia, New Zealand, etc. Check out my profile.
