How to Format Date to MMDDYYYY in JavaScript

Often developers need to format dates in JavaScript in various formats. In this article, we will learn how to format date to MMDDYYYY in JavaScript.

How to Format Date to MMDDYYYY in JavaScript

Let us say you have a variable with present date value in it.

var d = new Date();

Here is what this variable will look like.

Wed Apr 20 2022 11:48:03 GMT+0530 (India Standard Time)

It has quite a lot of information such as year, month, date, day of the week, time zone. Often we don’t need so much information but we need our date values in specific formats to be able to process them further.

Basically, we need 3 key functions to extract the day, month and year information from a given JavaScript date. For this purpose, we need 3 functions – getDate(), getMonth() and getFullYear() for getting date, month and 4 digit year values respectively. If you need to get 2 digit year values, you can use getYear() function.

getDate() // Returns the date
getMonth() // Returns the month starting from 0 for Jan, 1 for Feb, and so on.
getFullYear() // Returns the year

Using the above functions you can easily convert your date to MMDDYYYY format as shown below.

var d = new Date();
var curr_date = d.getDate();
var curr_month = d.getMonth() + 1; //Months are zero based
var curr_year = d.getFullYear();
console.log(curr_month + curr_date + curr_year);

Please note, in the above code, we add 1 to the value returned from d.getMonth() function because the month values start from 0 for Jan, 1 for Feb, 2 for March, etc.

The above code will display your date as 4202022 (For April 20, 2022). If you want this date to be displayed as MM/DD/YYYY, you can modify the console.log() command as

console.log(curr_month + '/' + curr_date + '/' + curr_year);

The above command will display the output as 4/20/2022. You will notice that the month value does not have a leading zero in case of single digits. If you want your month values to show 2 digits irrespective of the month value, just add the following line after you get curr_month.

curr_month = curr_month.length > 1 ? curr_month : '0' + curr_month;

In the above code, we basically check the number of characters in curr_month variable. If it is single digit, we prepend a ‘0’ to it.

Now your modified code will like the following.

var d = new Date();
var curr_date = d.getDate();
var curr_month = d.getMonth() + 1; //Months are zero based
curr_month = curr_month.length > 1 ? curr_month : '0' + curr_month;
var curr_year = d.getFullYear();
console.log(curr_month + curr_date + curr_year);

Now when you run the above code, you will get the output as 04202022 where the month number will have a leading zero.

In this article, we have learnt several simple ways to format date in JavaScript. You can modify it as per your requirement. Date format conversion is a very common problem faced by JS developers since the default JS date is not really in a popular format. The trick is to use the 3 functions getDate(), getMonth() and getFullYear() to extract the date, month and year values and then concatenate them as per your requirement.

How to Format Date to MMDDYYYY in JavaScript

How to Format Date to MMDDYYYY in JavaScript

Related posts:

Leave a Reply Cancel reply