Skip to main content

How to Get the Month and Day in a 2-Digit Format in JavaScript

A very common requirement when displaying or logging dates is to format the month and day numbers as two digits, with a leading zero for single-digit values (e.g., 01, 05, 12). This ensures consistent string length, which is crucial for sorting and alignment.

This guide will teach you the modern and most robust method for this task using the Intl.DateTimeFormat API. We will also cover the classic manual approach using padStart() so you can understand the underlying logic.

The Core Problem: Inconsistent String Length

When you get the month or day from a Date object, they are returned as numbers. This can lead to inconsistent string lengths.

const date1 = new Date('2025-03-05');   // March 5th
const date2 = new Date('2025-12-15'); // December 15th

const month1 = date1.getMonth() + 1; // getMonth() is 0-based, so we add 1
const day1 = date1.getDate();
console.log(`${month1}/${day1}`); // Output: "3/5"

const month2 = date2.getMonth() + 1;
const day2 = date2.getDate();
console.log(`${month2}/${day2}`); // Output: "12/15"
note

The inconsistent lengths (3/5 vs. 12/15) are not ideal for display or for creating sortable filenames.

The Intl (Internationalization) API is the standard, built-in tool for all locale-sensitive number and date formatting. It has a specific option for ensuring a 2-digit format.

Solution: by using the { month: '2-digit', day: '2-digit' } options, you can easily get the desired format.

const date = new Date('2025-07-01');

// Create a formatter with the '2-digit' option for month and day.
const formatter = new Intl.DateTimeFormat('en-US', {
year: 'numeric',
month: '2-digit',
day: '2-digit',
});

const formattedDate = formatter.format(date);
console.log(formattedDate);

// You can also get the parts individually
const parts = formatter.formatToParts(date);
console.log(parts);

Output:

07/01/2025
[
{
"type": "month",
"value": "07"
},
{
"type": "literal",
"value": "/"
},
{
"type": "day",
"value": "01"
},
{
"type": "literal",
"value": "/"
},
{
"type": "year",
"value": "2025"
}
]
note

This is the recommended best practice because it is powerful, flexible, and handles different locales and formats correctly.

The Manual Method: .padStart()

If you need a quick and simple solution without the Intl API, you can build the formatted string manually. The String.prototype.padStart() method is the key to adding the leading zero.

The logic:

  1. Get the month or day number from the Date object.
  2. Convert the number to a string.
  3. Call .padStart(2, '0') on the string. This will add a 0 to the beginning of the string only if its length is less than 2.

Solution:

function getFormattedDateParts(date) {
// getMonth() is 0-based, so add 1
const month = (date.getMonth() + 1).toString().padStart(2, '0');
const day = date.getDate().toString().padStart(2, '0');
const year = date.getFullYear();

return { month, day, year };
}

// Example Usage:
const date = new Date('2025-07-01');
const { month, day, year } = getFormattedDateParts(date);

console.log(`Month: ${month}`); // Output: Month: 07
console.log(`Day: ${day}`); // Output: Day: 01
console.log(`${year}-${month}-${day}`); // Output: 2025-07-01
note

This method is effective for simple, fixed-format requirements but lacks the flexibility of the Intl API.

Why the Intl API is the Best Practice

While the manual padStart() method works well for a single format, the Intl.DateTimeFormat API is superior for several reasons:

  • Locale-Aware: It can automatically handle different date formats for different regions (e.g., MM/DD/YYYY in the US vs. DD/MM/YYYY in the UK) just by changing the locale string.
  • More Powerful: It can format many other parts of a date, such as the full month name ('long'), weekday, and timezone.
  • No Manual Logic: You don't have to remember that getMonth() is zero-based or manually handle padding.

Conclusion

For formatting month and day numbers to a 2-digit format, modern JavaScript provides excellent tools.

  • The Intl.DateTimeFormat API with the { month: '2-digit', day: '2-digit' } options is the recommended best practice. It is the most powerful, flexible, and correct solution for any user-facing application.
  • The manual padStart() method is a functional and straightforward alternative for simple, fixed-format needs, such as generating a YYYY-MM-DD string for a database.