This tutorial will demonstrate the methods to set the date in a YYYY-MM-DD format.
How to Format a Date as YYYY-MM-DD in JavaScript?
To format the date as YYYY-MM-DD, use the following JavaScript predefined methods:
Method 1: Format a Date as YYYY-MM-DD Using the Concatenation of the getFullYear(), getMonth(), and getDate() Methods
For converting the date to ISO format YYYY-MM-DD, use the “getFullYear()”, “getMonth()” and “getDate()” methods of the Date object. These methods get the month, year, and date of the respective given date.
In the upcoming examples, we will show you how it works and what we could do for a 2-digit month and date.
Syntax
The following syntax is used for the getFullYear(), getMonth(), and getDate() methods:
date.getMonth() + 1
date.getDay()
In the above syntax:
- The “getFullYear()” method gives the year in 4 digits of the specified date.
- The “getMonth()” method outputs the month from 0 to 11 of date.
- “getDay()” method returns a day of the week.
Example 1: Format a Date Using the Concatenation of the getFullYear(), getMonth(), and getDate() Methods
Create a new Date object by passing a specific date in the short date format as a parameter that will be formatted:
Get the year, month, and date from the given date using the JavaScript getFullYear(), getMonth(), and getDate() methods:
Finally, print the resultant date on the console:
The output shows it is not in proper format as the month and the date is not in the 2-digit format:
Let’s see how to get the month and date in a 2-digit format.
Example 2: Format a Date Using the Concatenation of the getFullYear(), getMonth(), and getDate() Methods in YYYY-MM-DD Format
Here, we will utilize all the JavaScript getFullYear(), getMonth(), and getDate() methods and set the append 0 as a prefix if the month and date are less than 10:
Lastly, print the resultant date on the console using the “console.log()” method:
Output
Let’s try another method to format the date in YYYY-MM-DD format.
Method 2: Format a Date as YYYY-MM-DD Using the toLocaleDateString() Method
Use the “toLocaleDateString()” method to convert the date to the YYYY-MM-DD format. It gives a language-sensitive date representation string as an output. In this method, set the “option” parameter to “2-digit“, which will return month and day in 2 digits if the value is less than 10.
Syntax
Follow the given syntax for using the toLocaleDateString() method:
In the above syntax:
- “locales” is a string.
- “options” is an object that adjusts the output format.
Example
Call the “toLocaleDateString()” method and retrieve the year from the given date and store it in a variable “getYear”:
Similarly, get the month and date from the date using the “toLocaleDateString()” method and store them in variables, respectively:
var getDay = date.toLocaleString("default", { day: "2-digit" });
Now, set the date in a specific format by accessing variables that store the year, month, and day in a specified format:
Print the resultant date on the console:
The output shows that the date is successfully converted into YYYY-MM-DD format
We have provided all the best possible solutions to format a Date as in YYYY-MM-DD in JavaScript.
Conclusion
To set the format of a date as YYYY-MM-DD in JavaScript, use the “toLocaleDateString()” method or the concatenation of the “getFullYear()”, “getMonth()” and “getDate()” methods. In the toLocaleDateString() method, set the “option” parameter to the “2-digit” number for month and date while, in the second approach, append leading zero to the resultant value if it is less than 10. This tutorial demonstrated the methods to set the date in a YYYY-MM-DD format.