JavaScript Date Objects and Date Formats

In this tutorial, you'll learn about Date objects in JavaScript.

Creating a Date Object

The new Date() constructor generates a date object set to the current date and time.

const currentDate = new Date();
console.log(currentDate); // Outputs the current date and time

Creating Date Objects from a String

You can create a date object based on a specific date string using new Date(dateString).

const specificDate = new Date("October 13, 2014 11:13:00");
console.log(specificDate); // Output: Mon Oct 13 2014 11:13:00 GMT
const anotherDate = new Date("2022-03-25");
console.log(anotherDate); // Output: Fri Mar 25 2022

Note: Date objects are static. Once created, they do not update automatically.

Creating JavaScript Date Objects

JavaScript provides multiple ways to instantiate a date object:

Standard

console.log(new Date()); // Current date and time
console.log(new Date("2023-06-15")); // Specific date from a string

Using Parameters

The new Date(year, month, ...) constructor allows you to define a date with specific components.

const customDate = new Date(2018, 11, 24, 10, 33, 30, 0);
console.log(customDate); // Output: Mon Dec 24 2018 10:33:30

Note: JavaScript months start at 0 (January) and end at 11 (December).

Handling Overflow in Dates

If you specify values beyond the expected range, JavaScript automatically adjusts them.

const overflowMonth = new Date(2018, 15, 24, 10, 33, 30);
console.log(overflowMonth); // Equivalent to: April 24, 2019

const overflowDay = new Date(2018, 5, 35, 10, 33, 30);
console.log(overflowDay); // Equivalent to: July 5, 2018

Date Creation with Different Parameter Counts

console.log(new Date(2018, 11, 24, 10, 33, 30)); // Year, month, day, hours, minutes, seconds
console.log(new Date(2018, 11, 24, 10, 33)); // Year, month, day, hours, minutes
console.log(new Date(2018, 11, 24, 10)); // Year, month, day, hours
console.log(new Date(2018, 11, 24)); // Year, month, day
console.log(new Date(2018, 11)); // Year, month

Important: If only one parameter is provided, it is treated as milliseconds since January 1, 1970.

console.log(new Date(2018)); // Misinterpreted as milliseconds, not a year

Handling Previous Century Years

Years with one or two digits are interpreted as 19xx.

console.log(new Date(99, 11, 24)); // Interpreted as: Dec 24, 1999
console.log(new Date(9, 11, 24)); // Interpreted as: Dec 24, 1909

Displaying Dates

By default, JavaScript displays dates using toString():

const today = new Date();
console.log(today.toString()); // Outputs date with time zone
console.log(today.toDateString()); // Outputs date in a readable format
console.log(today.toUTCString()); // Outputs date in UTC format
console.log(today.toISOString()); // Outputs date in ISO format

JavaScript Date Formats

ISO 8601 is an international standard for representing dates and times. JavaScript follows this standard, and the recommended date format is YYYY-MM-DD.

Example:

const dateInstance = new Date("2015-03-25");
console.log(dateInstance);
// Output: Wed Mar 25 2015 00:00:00 GMT+0000 (Coordinated Universal Time)

ISO Dates: Year and Month Format

You can write ISO dates without specifying the day using the YYYY-MM format.

const dateInstance = new Date("2015-03");
console.log(dateInstance);
// Output may vary depending on the time zone, e.g., Sun Mar 01 2015 00:00:00 GMT+0000

Note: The output may vary due to time zone differences and might return February 28 or March 1.

ISO Dates: Year Only

ISO dates can be written without specifying the month or day, using the YYYY format.

const dateInstance = new Date("2015");
console.log(dateInstance);
// Output may vary based on time zone, e.g., Wed Dec 31 2014 19:00:00 GMT-0500

Note: The date may be interpreted as December 31, 2014, or January 1, 2015, depending on your time zone.

ISO Dates: Date and Time

ISO dates can include time using the format YYYY-MM-DDTHH:MM:SSZ.

const dateInstance = new Date("2015-03-25T12:00:00Z");
console.log(dateInstance);
// Output: Wed Mar 25 2015 12:00:00 GMT+0000

Explanation:

• The letter T separates the date and time.
• Z indicates Coordinated Universal Time (UTC).

To specify a different time zone, use the +HH:MM or -HH:MM format instead of Z.

const dateInstance = new Date("2015-03-25T12:00:00-06:30");
console.log(dateInstance);
// Output: Wed Mar 25 2015 18:30:00 GMT+0000

Important: If you omit the T or Z, browsers may interpret the date differently, causing inconsistent results.

Time Zones and Their Impact

If a date is created without specifying a time zone, JavaScript defaults to the browser's time zone.

const dateInstance = new Date("2015-03-25");
console.log(dateInstance.toString());
// Output varies based on user location, e.g., "Wed Mar 25 2015 00:00:00 GMT+0530 (India Standard Time)"

JavaScript Short Dates

Short dates use the MM/DD/YYYY format.

const dateInstance = new Date("03/25/2015");
console.log(dateInstance);
// Output: Wed Mar 25 2015 00:00:00 GMT+0000

Omitting leading zeros in the month or day may cause errors.

const dateInstance = new Date("2015-3-25");
console.log(dateInstance); // Output: Wed Mar 25 2015 00:00:00 GMT+0000 (Coordinated Universal Time)

The YYYY/MM/DD format is unpredictable and may vary across browsers.

const dateInstance = new Date("2015/03/25");
console.log(dateInstance); // Output: Wed Mar 25 2015 00:00:00 GMT+0000 (Coordinated Universal Time)

The DD-MM-YYYY format is also unreliable and may return NaN.

const dateInstance = new Date("25-03-2015");
console.log(dateInstance); // Output: Invalid Date

JavaScript Long Dates

Long dates use the MMM DD, YYYY format.

const dateInstance = new Date("Mar 25, 2015");
console.log(dateInstance);
// Output: Wed Mar 25 2015 00:00:00 GMT+0000

The month and day can appear in any order.

const dateInstance = new Date("25 Mar 2015");
console.log(dateInstance);
// Output: Wed Mar 25 2015 00:00:00 GMT+0000

Months can be written in full or abbreviated.

const dateInstance1 = new Date("January 25, 2015");
const dateInstance2 = new Date("Jan 25, 2015");
console.log(dateInstance1, dateInstance2);
// Output: Sun Jan 25 2015 00:00:00 GMT+0000 Sun Jan 25 2015 00:00:00 GMT+0000

Note:

• Commas are optional.

• Month names are case-insensitive.