Format a date as YYYY-MM-DD hh:mm:ss in JavaScript will be very useful when you want to set UI and want to style the time show. So how to do it? – Let’s go into detail.
Format a date as YYYY-MM-DD hh:mm:ss in JavaScript
There are some methods for you to get time in Javascript. You can use new Date()
constructor to get the current time in your location. Then the toISOString()
method helps you to make an instance that returns a string indicating the current time.
Example:
const currentTime = new Date(); console.log(currentTime.toISOString());
Output:
2022-10-06T09:40:18.310Z
This type of time call ISO Dates (YYYY-MM-DDTHH:MM: SSZ
).
If you want to get time in a millisecond from 00:00:00 January 1, 1970 till now, you can use the now()
function.
Example:
const time = Date.now(); console.log(time);
Output:
1665049739373
Or you can use this trick.
Example:
const time = new Date() * 1; console.log(time);
Output:
1665049811747
There are a lot of ways to play with time in Javascript. You can read more about it here.
You can follow the method below if you want your time to be expressed as YYYY-MM-DD
.
Use getFullYear() , getMonth(), getDate() method
Javascript provide for us some very use method that help you to get separate year, month, date which is getFullYear()
, getMonth()
, getDate()
method. Like its name, those methods will help you to get a year in four-digit number type, month in the range from 0 to 11, and Date from 1 to 31. In Javascript, it will count from 0, so with the getMonth()
method, remember to plus one to the result.
Example:
const time = new Date(); const month = time.getMonth() + 1; const day = time.getDate(); const year = time.getFullYear(); console.log("month: ", month); console.log("date: ", day); console.log("year: ", year);
Output:
month: 10
date: 6
year: 2022
Here to connect it together, we can do this:
Example:
const time = new Date(); const month = time.getMonth() + 1; const day = time.getDate(); const year = time.getFullYear(); const timeShow = `${year}-${month}-${day}`; console.log(timeShow);
Output:
2022-10-6
But notice that here the date is six, which is not bigger than ten then just have only one digit. But in some browsers, with month and Date that do not have 0 before the number only has one digit will lead to an error. To solve it, you can use the padStart()
method.
The padStart() method
The padStart()
method will help you to check that your string is not enough length you require, then insert the string you want at the start point.
Syntax:
string.padStart(length, padString)
Parameters
- length: Fixed length that you want. If your original string length is lower, padString will be added.
- padString: A string that you want to pad to your origin string.
Example:
const time = new Date(); const month = time.getMonth() + 1; const date = time.getDate(); const year = time.getFullYear(); const monthPadded = (month + "").padStart(2, "0"); const datePadded = (date + "").padStart(2, "0"); const timeShow = `${year}-${monthPadded}-${datePadded}`; console.log(timeShow);
Output:
2022-10-06
Here I plus month
and date
with an empty string is a trick that helps you convert from number to string type. As you see with the padStart()
method, for a single digit month, a zero is added before it.
Summary
In this tutorial, I’ve shown you how to format a Date as YYYY-MM-DD hh:mm:ss in JavaScript. Hopefully it will be useful for you. Thanks for reading!
Maybe you are interested:
- Get a GMT timestamp using JavaScript
- Format a Date as MM/DD/YYYY hh:mm:ss in JavaScript
- Validate a Date formatted as DD/MM/YYYY in JavaScript
Hello, guys! I hope that my knowledge in HTML, CSS, JavaScript, TypeScript, NodeJS, ReactJS, MongoDB, Python, MySQL, and npm computer languages may be of use to you. I’m Brent Johnson, a software developer.
Name of the university: HOU
Major: IT
Programming Languages: HTML, CSS, JavaScript, TypeScript, NodeJS, ReactJS, MongoDB, PyThon, MySQL, npm