What format are JavaScript dates in?

Most developers, at some point in their career, will need to handle the very common task of formatting a time or date in JavaScript. While there are endless reasons to display (or manipulate) current, past, and future times and dates, the problem faced by many JavaScript developers is that the tools and methods to do so can seem equally endless.

JavaScript’s built-in time and date formatting methods can cover pretty much any situation involving time data that you can imagine. Yet, many developers choose to rely on third-party libraries to help them with this tedious and repetitive work. We’ll touch on those third-party solutions in a moment, but let’s get started with some basic JavaScript time formatting.

JavaScript’s Date() function object contains a long list of methods that can be used to manipulate the date outcome, as well as display time and date data as specific instances or ranges of time, dates, and time zones. Let’s look at the default Date() function below:

let date = new Date();
console.log(date); 
// Output: Tue Jul 21 2020 10:01:14 GMT+0100 (UK Daylight Time)

This example demonstrates the most common usage of the Date() function. If no other function is assigned, it prints the time and date in a localized format as seen above. We can modify the localized date string format by using the method toLocaleString(). Simply provide a language and a country (in standard locale code format, i.e. ‘en-US’) as arguments to the function, and the Date library will properly format the output to the desired locale:

console.log(date.toLocaleString('en-US'));
// Output: 7/21/2020, 10:01:14 AM

In this example we used the toLocaleString() method to apply the “English-US” time format. The output matches the US English common time format: D/MM/YYYY HH:MM:SS AM/PM.

toLocaleString() allows us to customize specific sections of the provided result by modifying the associated parameters. Below is a list of the parameter names and types that are available when formatting time strings:

console.log(date.toLocaleString('en-US', {
    weekday: 'short', // long, short, narrow
    day: 'numeric', // numeric, 2-digit
    year: 'numeric', // numeric, 2-digit
    month: 'long', // numeric, 2-digit, long, short, narrow
    hour: 'numeric', // numeric, 2-digit
    minute: 'numeric', // numeric, 2-digit
    second: 'numeric', // numeric, 2-digit
}));
 // Output: Tue, July 21, 2020, 10:01:14 AM

As you can see above, toLocaleString() receives a language code as the first parameter, and an optional object as the second parameter. This second parameter allows us to define the formatting for each part of the outcome result individually – the comments show the possible values for each potential key in the argument.

At this point, we’ve only scratched the surface of the things you can do with JavaScript’s Date() function. You can find more examples of how to use this powerful native library here.

The JavaScript date object can be used to get a year, month and day. We can display a timer on the webpage with the help of a JavaScript date object.

There are many types of date formats in JavaScript: ISO Date, Short Date, and Long Date. The formats of JavaScript's date are defined as follows:

ISO date

Short date

Long date

The ISO date format follows a strict JavaScript's standard, while the other formats (Short date and Long date) are browser dependent and not so well defined.

Now, let's understand these date formats individually.

ISO date

The ISO 8601 is the international standard for the times and dates, and the syntax (YYYY-MM-DD) of this standard is the preferred date format in JavaScript.

The example of using the ISO date is given below.

Example

The output of the below code will display the complete date, which is relative to the current time zone.

Output

Now, we are discussing some other formats of the ISO date. Here, we are writing the input date and displaying the result that occurred when we use the corresponding syntax.

We can write the ISO dates using the following syntaxes.

1. This is a complete date format using ISO date.

let val = new Date("2020-08-01");

2. In this format, we specify only year and month (YYYY-MM) without day.

let val = new Date("2020-08");

3. In the third syntax, we only specify the year (YYYY) without month and day.

let val = new Date("2020");

4. Now, in the fourth syntax, we specify the date with added hours, minutes, and seconds. (YYYY-MM-DDTHH:MM:SSZ). In this format, the date and time are separated with the letter 'T' and the letter 'Z'. We get different results in different browsers if we remove these characters.

JavaScript uses the browser's time zone if we set the date without specifying the time zone.

let val = new Date("2020-08-01T07:05:00Z");

Now, we discuss the short date format along with an example.

JavaScript Short Date

The "MM/DD/YYYY" is the format used to write short dates. Now, we understand the short date by using an example.

Example

Here, we are specifying the short date format, i.e., "MM/DD/YYYY".

Output

After the execution of the above code, the output will be -

JavaScript Long Date

The "MMM DD YYYY" is the format used to write Long dates. The month and date can be written in any order, and it is allowed to write a month in abbreviated (Aug) form or in full (August).

Now, we understand the Long date by using an example.

Example

Here, we are using the Long date format, i.e., "MMM DD YYYY", and specifying the month in abbreviated form.

What date format is DD MMM YYYY JavaScript?

How to display date format in JavaScript?

Is YYYY DD MM a date format?