How to Format a Date in JavaScript ?
Last Updated :
29 Dec, 2023
In this article, we will learn about the different ways of formatting a Date object into different date strings of different formats using JavaScript.
The below list contains the different ways of formatting Date in JavaScript:
The toDateString() method formats the date object into a human-readable format as Day Month Date Year.
Syntax:
dateObj.toDateString();
Example: The below code example explains the use of the toDateString() method to format the date.
Javascript
const currentDate = new Date();
const formattedDate = currentDate.toDateString();
console.log(formattedDate);
|
The toISOString() method will format the data into the International Standards following the ISO 8601 format.
Syntax:
dateObj.toISOString();
Example: The below code example implements the toISOString() method to format the date object.
Javascript
const currentDate = new Date();
const formattedDate = currentDate.toISOString();
console.log(formattedDate);
|
Output
2023-12-29T09:39:27.634Z
This method will format the date part of the date object into the same format as acquired by your system or in the specified format.
Syntax:
dateObj.toLocaleDateString();
Example: The below code example converts the date into the format acquired by your system.
Javascript
const currentDate = new Date();
const formattedLocalDate = currentDate.toLocaleDateString();
const formattedInSpecifiedFormat = currentDate.toLocaleDateString( "hi-IN" );
console.log(formattedLocalDate);
console.log(formattedInSpecifiedFormat);
|
Output
12/29/2023
29/12/2023
This method will work in the similar way as the toLocaleDateString() works. The only difference is that it also returns the time with the formatted string.
Syntax:
dateObj.toLocaleString();
Example: The below example uses the toLocaleString() method to format the date.
Javascript
const currentDate = new Date();
const formattedLocalDate = currentDate.toLocaleString();
const formattedInSpecifiedFormat = currentDate.toLocaleString( "hi-IN" );
console.log(formattedLocalDate);
console.log(formattedInSpecifiedFormat);
|
Output
12/29/2023, 9:39:27 AM
29/12/2023, 9:39:27 am
This is a powerful object method to format the date object. It formats the date into specified format and with the specified options for formatting the date and time.
Syntax:
const formatObj = new Intl.DateTimeFormat("en-US");
formatObj.format(dateObj);
Example: The below example formats the date object using the intl.DateTimeFormat() object method.
Javascript
const currentDate = new Date();
const dateTimeFormatter = new Intl.DateTimeFormat( "en-US" , {dateStyle: 'long' });
const formattedDate = dateTimeFormatter.format(currentDate);
console.log(formattedDate);
|
In this approach, we will use the different date methods to get the day, date, month and year of the date object and then concat them to form a formatted date string.
Example: The below code example uses the different date methods to get date and format it.
Javascript
const weekDays =
[ 'Sun' , 'Mon' , 'Tue' , 'Wed' , 'Thu' , 'Fri' , 'Sat' ];
const monthsArr =
[ 'Jan' , 'Feb' , 'Mar' , 'Apr' , 'May' , 'Jun' , 'Jul' , 'Aug' , 'Sep' , 'Oct' , 'Nov' , 'Dec' ];
const currentDateObj = new Date();
const currentDay = weekDays[currentDateObj.getDay()];
const currentDate = currentDateObj.getDate();
const currentMonth = monthsArr[currentDateObj.getMonth()];
const currentYear = currentDateObj.getFullYear();
console.log(`${currentDay} ${currentDate} ${currentMonth}, ${currentYear}`);
|
Share your thoughts in the comments
Please Login to comment...