How to format a date as MM/DD/YYYY hh:mm:ss in Javascript

To format a date as MM/DD/YYYY hh:mm:ss in JavaScript, we will use the Date object and string concatenation methods. Let’s read this article to have more knowledge about this topic.

Format a date as MM/DD/YYYY hh:mm:ss in JavaScript

The idea to do it is that we will get all the elements in the Date object. Then add “/” and “:” to join those elements.

In Javascript, we use methods to get the values of date, month, year, hour, minute and second respectively: getDate(), getMonth(), getYear(), getHours(), getMinutes() and getSeconds(). We have introduced these methods in detail in this article. Also, to add special characters between elements, we use the following methods.

Using the plus operator ‘+‘

As the name of the operator, we will use addition to add strings in JavaScript and create a new string. The addition operator also won’t mutate the original string.

Code sample:

let date = new Date();
let month = String(date.getMonth() + 1).padStart(2, '0');
let day = String(date.getDate()).padStart(2, '0');
let year = date.getFullYear();
let hour = String(date.getHours()).padStart(2, '0');
let minute = String(date.getMinutes()).padStart(2, '0');
let second = String(date.getSeconds()).padStart(2, '0');
console.log(month + '/' + day + '/' + year + ' ' + hour + ':' + minute + ':' + second);

Output:

Using join() method

The Javascript array join() method joins all the elements in an array to a string.

Syntax:

array.join(separator)

Parameter:

• separator: Specifies a string to separate the elements in an array.

Return value: A string after combining all array elements.

Code sample:

let date = new Date();

let day = [
	String(date.getMonth() + 1).padStart(2, '0'),
	String(date.getDate()).padStart(2, '0'),
	date.getFullYear()
].join('/');

let hours = [
	String(date.getHours()).padStart(2, '0'),
	String(date.getMinutes()).padStart(2, '0'),
	String(date.getSeconds()).padStart(2, '0')
].join(':');

console.log([day, hours].join(" "));

Output:

Using slice() method

The slice() function has the function to extract some elements of the array. The parameter will determine the position of the beginning and the ending extraction passed to the function.

Syntax:

array.slice(start, end)

Parameters:

• start: The start position
• end: The end position, the result will not include the end element.

If the start and end positions are negative values, the function will count from the end to the beginning of the array.

Code sample:

let date = new Date();
let month = ('0' + (date.getMonth() + 1)).slice(-2);
let day = ('0' + date.getDate()).slice(-2);
let year = date.getFullYear();
let hour = ('0' + date.getHours()).slice(-2);
let minute = ('0' + date.getMinutes()).slice(-2);
let second = ('0' + date.getSeconds()).slice(-2);
console.log(month + '/' + day + '/' + year + ' ' + hour + ':' + minute + ':' + second);

Here, to ensure the month, date, year, hour, minute, and seconds always have a 2-character-formate we have to add 0 to the first and last to the slice(-2) function to return the last 2 elements.

Output:

Summary

Above, I have shown you how to format a date as MM/DD/YYYY hh:mm:ss in Javascript using many simple solutions. I hope they are helpful to you. To better understand the lesson’s content, practice rewriting today’s examples. Have a great day!

Maybe you are interested:

• Format a Date as YYYY-MM-DD hh:mm:ss in JavaScript
• Convert seconds to HH:MM:SS in JavaScript
• Validate a Date formatted as MM/DD/YYYY in JavaScript

Joni Smith

Hi, my name is Joni Smith. My job is a programmer. I love learning programming languages, especially C++, C#, php, javascript, html, css. I want to share them with you. I hope my articles will bring a lot of useful knowledge to you.

---

Name of the university: HVNH BA
Major: htttql MIS
Programming Languages: C++, C#, php, javascript, html, css