How to Create a Date from Day, Month, and Year in JavaScript
A common requirement in programming is to create a Date object from individual numeric components for the year, month, and day. This is essential when you're working with data from a database, parsing user input from separate fields, or constructing a specific date for calculations. The standard way to do this in JavaScript is with the new Date() constructor.
This guide will teach you how to use the Date constructor correctly, explain the most critical "gotcha" you need to be aware of—the zero-based month—and show you how to apply this knowledge to practical scenarios like parsing a date string.
The Core Method: new Date(year, monthIndex, day)
The Date constructor can be called with several different arguments. The most common signature for this task takes at least three numbers: the year, the month index, and the day.
The syntax:
new Date(year, monthIndex, day)
For example, we have separate numeric values for a date and need to combine them into a single Date object.
// Problem: How to create a Date object for October 27, 2023?
const year = 2023;
const month = 9; // See the next section for why this is 9, not 10!
const day = 27;
Solution:
const year = 2023;
const monthIndex = 9; // 9 represents October
const day = 27;
const myDate = new Date(year, monthIndex, day);
console.log(myDate); // Output: Fri Oct 27 2023 00:00:00 GMT....
This creates a Date object set to the beginning of that day (midnight) in the user's local timezone.
The Most Important Rule: The Zero-Based Month
This is the single biggest source of bugs when using this constructor. The monthIndex parameter is zero-based.
- 0 = January
- 1 = February
- ...
- 9 = October
- 11 = December
If you have a month number from a user or another system (where January is 1), you must subtract 1 from it before passing it to the Date constructor.
Practical Example: Creating a Date from a String
A very common use case is parsing a date string in a known format like YYYY-MM-DD. While you can pass this string directly to new Date(), it's more robust to parse it manually to avoid browser inconsistencies.
For example, we have a date string and want to reliably convert it to a Date object.
const dateString = '2023-10-27';
Solution:
const dateString = '2023-10-27';
const parts = dateString.split('-'); // -> ['2023', '10', '27']
// Convert parts to numbers and adjust the month
const year = Number(parts[0]);
const month = Number(parts[1]);
const day = Number(parts[2]);
// CRITICAL: Subtract 1 from the month for the zero-based index
const myDate = new Date(year, month - 1, day);
console.log(myDate); // Output: Fri Oct 27 2023 00:00:00 GMT...
Adding Time Components (Hours, Minutes, Seconds)
The Date constructor can also accept arguments for time, allowing you to create a more precise Date object.
The syntax:
new Date(year, monthIndex, day, hours, minutes, seconds, milliseconds)
Solution:
// Create a Date for October 27, 2023, at 10:30 AM
const myDate = new Date(2023, 9, 27, 10, 30, 0);
console.log(myDate); // Output: Fri Oct 27 2023 10:30:00 GMT...
Understanding Date Rollover
A useful feature of the Date constructor is that it automatically handles "out-of-range" values by rolling them over. For example, if you provide 29 for the day in a non-leap-year February, it will correctly calculate the date as March 1st.
For example:
// February 29, 2023 does not exist.
const invalidDate = new Date(2023, 1, 29);
// JavaScript automatically rolls it over to the next valid day.
console.log(invalidDate);
// Output: Wed Mar 01 2023 00:00:00 GMT...
This makes the constructor resilient and useful for date arithmetic.
Conclusion
Creating a Date object from individual day, month, and year components is straightforward with the new Date() constructor, as long as you remember the most critical rule.
- The primary method is
new Date(year, monthIndex, day). - Always remember that the
monthIndexis zero-based (0 = January). If you have a 1-based month number, you must subtract 1. - For reliable results with date strings, parse the string manually and pass the numeric components to the constructor.