✖

All TalkersCode Topics

Follow TalkersCode On Social Media

Change Date Format In JavaScript

Last Updated : Jan 1, 2023

IN - JavaScript

Change Date Format In JavaScript

In this tutorial we will show you the solution of change date format in JavaScript, working with date is very common scenario when we create web applications.

Also, one thing more that date is common or say basic program. Every programmer or developer should know about how to change date format in web languages. Let us see how to change date format.

Step By Step Guide On Change Date Format In JavaScript :-

As, there are many ways with the help of which we are able to change date format in JavaScript. For this first of all we have to get date in JavaScript with help of new Date() format.

And after storing it in variable we have to change format and print date. Let us see with the help of codes. 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>home page</title>
</head>
<body>
 <script type="text/javascript">
let currentDate = new Date()
let newDate = currentDate.getDate() + "-" + (currentDate.getMonth() + 1) + "-" + currentDate.getFullYear()
console.log(newDate)
// another one
const months = ["JAN", "FEB", "MAR","APR", "MAY", "JUN", "JUL", "AUG", "SEP", "OCT", "NOV", "DEC"];
let currentDate = new Date()
let newDate = currentDate.getDate() + "-" + months[currentDate.getMonth()] + "-" + currentDate.getFullYear()
console.log(newDate)
 </script>
</body>
</html>
  1. First, we write <! DOCTYPE html> which we used as an instruction to the web browser about what version of HTML file is written in.
  2. Secondly, the <html> tag is used to indicate the beginning of an HTML document.
  3. As above now <head> tag is used to contain information about web page. In this tag a <title> tag is used which helps us to specify a webpage title. Both <head> and <title> tags are Paired tags. So, both have </head> and </title> ending tags respectively.
  4. Here, then we create a body tag. All the content which we want to show on browser’s screen or display is always written inside this codes.
  5. Here, under body we create script tag which is a paired tag. In this tag we write our JavaScript code.
  6. Here, we show you two methods. In first the date format is like 01-01-2000 and in next one we change our date format to 01-JAN-2000.
  7. Hence, here we show you two ways. In both of them common is that we get date from inbuilt function Date() and then we separate date, month and year from date using inbuilt function.
  8. In first one we then print date directly. But in second one you see that we declare a const there. With the help of which month is choose. And then we able to print date with required format. You must try other formats also.
  9. At last, the <body> and <html> tags are closed with </body> and </html> respectively.

Conclusion :-

At last in conclusion, here we can say that with the help of this article we are able to change date format using JavaScript.

I hope this tutorial on change date format in JavaScript helps you and the steps and method mentioned above are easy to follow and implement.

Latest Tutorials