How to get the month name in JavaScript
Łukasz Holeczek
Follow Łukasz Holeczek on GitHub
Connect with Łukasz Holeczek on LinkedIn
Follow Łukasz Holeczek on X (Twitter)
Converting numeric months to readable month names is crucial for user-friendly date displays, reports, and calendar interfaces.
As the creator of CoreUI, a widely used open-source UI library, I’ve implemented month name formatting in numerous date pickers and dashboard components across different languages.
From my expertise, the most modern and localization-friendly solution is to use toLocaleDateString() with the month option.
This approach provides automatic localization support and eliminates the need for hardcoded month arrays.
Use toLocaleDateString() with the month option to get localized month names.
const monthName = new Date().toLocaleDateString('en', {month: 'long'})
The toLocaleDateString() method with {month: 'long'} returns the full month name in the specified locale. The first parameter ’en’ sets the language (use ’en’ for English, ’es’ for Spanish, etc.), and the month option can be ’long’ for full names like “January”, ‘short’ for abbreviations like “Jan”, or ’numeric’ for numbers. This approach automatically handles different languages and cultural formatting preferences without requiring manual month arrays.
Best Practice Note:
This is the same approach we use in CoreUI components for international date formatting and multi-language support. For consistent formatting across your application, consider storing the locale preference and reusing it throughout your date formatting calls.
