Open In App

Get the relative timestamp difference between dates in JavaScript

Improve
Improve
Like Article
Like
Save
Share
Report

Given the 2 JavaScript dates and the job is to get the relative time difference between them(eg.. 2 hours ago, 2.5 days ago, etc.) Here 2 approaches are discussed with the help of javaScript. 

Approach 1: 

  • Get the prevDate and currDate in a variable using Date() object .
  • Calculate the milliseconds in Minute, Hour, Day, Month and in an Year.
  • Calculate the milliseconds difference between the prevDate and currDate.
  • Compare these milliseconds with the milliseconds in Minute, Hour, Day, Month and in an year in this order.
  • If the milliseconds are less than any of them, then calculate the respective Minutes, Hours, Days, Months and Years.

Example 1: This example implements the above approach. 

html




<body>
    <h1 style="color:green;">
        GeeksforGeeks
    </h1>
    <p id="GFG_UP">
    </p>
    <button onclick="GFG_Fun();">
        click here
    </button>
    <p id="GFG_DOWN">
    </p>
    <script>
        var up = document.getElementById('GFG_UP');
        var down = document.getElementById('GFG_DOWN');
        var prevDate = new Date();
        prevDate.setDate(prevDate.getDate() - 6);
        up.innerHTML =
            "Click on the button to get relative time difference between dates." +
            "<br><br>Older Date : " + prevDate;
          
        function timeDiff(curr, prev) {
            var ms_Min = 60 * 1000; // milliseconds in Minute
            var ms_Hour = ms_Min * 60; // milliseconds in Hour
            var ms_Day = ms_Hour * 24; // milliseconds in day
            var ms_Mon = ms_Day * 30; // milliseconds in Month
            var ms_Yr = ms_Day * 365; // milliseconds in Year
            var diff = curr - prev; //difference between dates.
            // If the diff is less then milliseconds in a minute
            if (diff < ms_Min) {
                return Math.round(diff / 1000) + ' seconds ago';
          
                // If the diff is less then milliseconds in a Hour
            } else if (diff < ms_Hour) {
                return Math.round(diff / ms_Min) + ' minutes ago';
          
                // If the diff is less then milliseconds in a day
            } else if (diff < ms_Day) {
                return Math.round(diff / ms_Hour) + ' hours ago';
          
                // If the diff is less then milliseconds in a Month
            } else if (diff < ms_Mon) {
                return 'Around ' + Math.round(diff / ms_Day) + ' days ago';
          
                // If the diff is less then milliseconds in a year
            } else if (diff < ms_Yr) {
                return 'Around ' + Math.round(diff / ms_Mon) + ' months ago';
            } else {
                return 'Around ' + Math.round(diff / ms_Yr) + ' years ago';
            }
        }
          
        function GFG_Fun() {
            var diff = timeDiff(new Date(), prevDate)
            document.getElementById("GFG_DOWN").innerHTML = diff;
        }
    </script>
</body>


Output:

 

Approach 2:

  • Get the prevDate and currDate in a variable.
  • Calculate the seconds, Minutes, Hours and Days difference between the dates.
  • Compare these parameters with the 60 seconds, 60 Minutes, 24 Hours, Day in this order.
  • If any of those condition satisfies then return the respective parameter.

Example 2: This example implements the above approach. 

html




<body>
    <h1 style="color:green;">
        GeeksforGeeks
    </h1>
    <p id="GFG_UP">
    </p>
    <button onclick="GFG_Fun()">
        click here
    </button>
    <p id="GFG_DOWN">
    </p>
    <script>
        var up = document.getElementById('GFG_UP');
        var down = document.getElementById('GFG_DOWN');
        var prevDate = new Date();
        prevDate.setDate(prevDate.getDate() - 6);
        prevDate.setHours(prevDate.getHours() - 6);
        up.innerHTML =
            "Click on the button to get relative time " +
            "difference between dates.<br><br>Older Date : " + prevDate;
          
        function conversion(ms) {
          
            // Calculating Seconds
            var sec = (ms / 1000).toFixed(1);
          
            // Calculating Minutes
            var min = (ms / (1000 * 60)).toFixed(1);
          
            // Calculating hours
            var hrs = (ms / (1000 * 60 * 60)).toFixed(1);
          
            // Calculating days
            var days = (ms / (1000 * 60 * 60 * 24)).toFixed(1);
            if (sec < 60) {
                return sec + " Sec";
            } else if (min < 60) {
                return min + " Min";
            } else if (hrs < 24) {
                return hrs + " Hrs";
            } else {
                return days + " Days"
            }
        }
          
        function GFG_Fun() {
            var date = new Date();
            var diff = conversion(date.getTime() - prevDate.getTime())
            document.getElementById("GFG_DOWN").innerHTML = diff;
        }
    </script>
</body>


Output:

 



Last Updated : 30 Dec, 2022
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads