Getting and formatting date and time in JavaScript

Last updated: July 7, 2022.

The in-built Date() object constructor can be used to generate date objects containing the date and time now or at custom time points.

Methods available on date and time objects created using the Date() constructor allow its contents to be output in common formats.

Generating dates

Getting the current date and time

You can get the current date and time by generating a new Date object:

const date = new Date();
console.log(date); // Mon Jul 04 2022 08:41:40 GMT+0200 (Central European Summer Time)

Setting a custom date and time

For a custom date and time, you enter the information in the Date() constructor to create a new Date object:

// Custom date format: YYYY, MM, DD, HH, MM, SS

const a = new Date(2022, 01, 01);
const b = new Date(1892, 06, 20, 13);
const c = new Date(2000, 11, 15, 19, 15, 30); 

console.log(a); // Tue Feb 01 2022 00:00:00 GMT+0100 (Central European Standard Time)
console.log(b); // Wed Jul 20 1892 13:00:00 GMT+0105 (Central European Standard Time)
console.log(c); // Fri Dec 15 2000 19:15:30 GMT+0100 (Central European Standard Time)

To get UTC (Coordinated Universal Time), add the toUTCString() method:

const now = new Date();

console.log(now); // Mon Jul 04 2022 21:45:32 GMT+0200 (Central European Summer Time)
console.log(now.toUTCString()); // Mon, 04 Jul 2022 19:45:32 GMT

For other time zones, add this inside an options object in the second argument position:

const now = new Date();

console.log(now); // Mon Jul 04 2022 21:50:31 GMT+0200 (Central European Summer Time)
console.log(now.toLocaleString(undefined, {
    timeZone: 'America/Chicago'
})); // 04/07/2022, 14:50:31

Displaying and formatting date and time

Default formats

A date and time object created using the Date() constructor has various methods available on it that output the date and/or time in string format:

const now = new Date();

now.toLocaleString(); // 04/07/2022, 20:31:35
now.toLocaleDateString(); // 04/07/2022
now.toLocaleTimeString(); // 20:31:35
now.toString(); // Mon Jul 04 2022 20:31:35 GMT+0200 (Central European Summer Time)
now.toDateString(); // Mon Jul 04 2022
now.toTimeString(); // 20:31:35 GMT+0200 (Central European Summer Time)
now.toISOString(); // 2022-07-04T18:31:35.398Z

With no arguments, these methods output in the locally accepted format of the user.

You can also specify the formatting by entering a language-country code when calling these methods:

const now = new Date();

now.toLocaleString('en-US'); // 7/4/2022, 9:25:06 PM
now.toLocaleString('en-GB'); // 04/07/2022, 21:25:06
now.toLocaleString('ar-EG'); // ٤‏/٧‏/٢٠٢٢, ٩:٣١:٥٦ م

Custom formatting with options

When using the methods available on a Date object to output its contents in string format, you can customize the output further by adding the following options.

• day: 'numeric' or '2-digit'
• weekday: 'narrow', 'short' or 'long'
• year: 'numeric' or '2-digit'
• month: 'numeric', '2-digit', 'narrow', 'short' or 'long'
• hour: 'numeric' or 2-digit'
• minute: 'numeric' or '2-digit'
• second: 'numeric' or '2-digit'
• timeZoneName: 'short' or 'long'
• hour12: true or false

The options and their values should be specified in an object and passed in as a second argument to the formatting method.

const now = new Date();

// Default output
now.toLocaleDateString(); // 04/07/2022

// No fixed locale formatting with options
now.toLocaleDateString(undefined, {
    weekday: 'long',
    month: 'long',
    day: 'numeric',
}); // Monday, 4 July

// Fixed 'en-us' formatting with options
now.toLocaleTimeString('en-US', {
    weekday: 'long',
    month: 'long',
    day: 'numeric',
    timeZoneName: 'short',
    hour12: false,
}); // Monday, July 4 at 21:16:05 GMT+2

Getting parts of the date

You can also return individual parts of the date to create your own formatting.

const now = new Date();

/* Get year */
now.getFullYear() // 2022

/* Get month (0-11) */
now.getMonth() // 6

/* Get day (1-31) */
now.getDate() // 5

/* Get day of the week (0-6) */
now.getDay() // 2

/* Get hour (0-24) */
now.getHours() // 13

/* Get minutes (0-59) */
now.getMinutes() // 56

/* Get seconds (0-59) */
now.getSeconds() // 12

/* Get milliseconds (0-999) */
now.getMilliseconds() // 628

Related links

• MDN Web Docs: Standard in-built objects > Date

---