How to convert epoch Date to meaningful JavaScript date?

Front End Technology Javascript Web Development

In this tutorial, we will learn to convert the epoch Date to a meaningful JavaScript date. The epoch date is a representation of the date in milliseconds, and it is a total number of milliseconds since 1st January 1970 since the UNIX epochs started.

Users can convert the total number of milliseconds into the meaningful date string using various approaches explained below.

Using the new Date() Object

In this approach, we will create the object of the Date class. The constructor of the Date() class takes the total number of milliseconds since the epoch started and converts it into the meaningful JavaScript date.

Syntax

Users can follow the syntax below to create the new object of the Date class by passing the total number of milliseconds as a parameter.

let milliseconds = 2302345654324; // epoch date
let date = new Date(milliseconds);

Example

In the example below, we have created the variable to store the total number of milliseconds and passed it as a parameter of the Date() constructor. The date object returns the date string; which users can see in the output.


<html>
<head>
</head>
<body>
   <h2>Converting epoch date to meaningful JavaScript date.</h2>
   <h4>Convert milliseconds since epoch to JavaScript Date using the <i>new Date()</i> object.</h4>
   <p id = "output1"></p>
   <script>
      let output1 = document.getElementById("output1");
      let milliseconds = 2302345654324;
      let date = new Date(milliseconds);
      output1.innerHTML += "date for total " + milliseconds + " milliseconds is : " + date + " <br/> ";
      date = new Date(902976543332);
      output1.innerHTML += "date for total 09876543332" + " milliseconds is : " + date + " <br/> ";
   </script>
</body>
</html>

Using the Various Methods of Date Class

In this approach, we will create the object of the date class and pass the total milliseconds since epoch as a parameter. After that, we will get the year, month, date, etc. separately from the date object and format the string according to our need.

Users can use the getFullYear() method to get the year. The getMonth() returns the number of months between 0 to 11. So, we need to add 1 to returned value to get the proper value of the month.

With the year and month, users can get all the necessary things to create the data using different methods, and for all methods, users can follow the syntax below.

Syntax

let milliseconds = 1348755654324;
let myDate = new Date( milliseconds );

// using various methods of Date class to get year, date, month, hours, minutes, and seconds.

let dateStr = myDate.getFullYear() + "/" + (myDate.getMonth() + 1) + "/" + myDate.getDate() + " " + myDate.getHours() + ":" + myDate.getMinutes() + ":" + myDate.getSeconds()

Example

In the example below, we have used all methods given in the syntax to get every separate part of the date and formatted the date string. We have created the object of the date class and invoked all the above methods by taking the date object as a reference.


<html>
<head>
</head>
<body>
   <h2>Converting epoch date to meaningful JavaScript date.</h2>
   <h4>Convert milliseconds since epoch to JavaScript Date using the <i>various methods Date class.</i></h4>
   <p id = "output1"></p>
   <script>
      let output1 = document.getElementById("output1");
      let milliseconds = 1348755654324;
      let myDate = new Date(milliseconds);
      let dateStr = myDate.getFullYear() + "/" + (myDate.getMonth() + 1) + "/" + myDate.getDate() + " " + myDate.getHours() + ":" + myDate.getMinutes() + ":" + myDate.getSeconds()
      output1.innerHTML += "date string for " + milliseconds + " milliseconds is : " + dateStr + " <br/> ";
   </script>
</body>
</html>

We have learned two different approaches to converting the epochs date to meaningful dates. However, users can also use the Moment.js library, which is the best one to manipulate the dates. Also, users can pass the year, month, date, etc., to the Date() object parameter, and it returns the date string.