Dates are essential information in any application. It is very common to have to know the difference in months, days, or even seconds between one date and another. To help, I have written this useful step by step for any case.
Essentially, to find out the difference between two dates, we need to:
- Convert the dates in milliseconds using getTime().
- Subtract the dates.
- Convert the result of the subtraction into a readable format.
Reading the step by step above, you have an overview of the process and can see that it is something simple, but let's dive into the details.
How to calculate the difference between two dates
My goal here is to teach you how to calculate the difference between two dates in JavaScript without the need for any external dependencies or scripts.
But if you came here looking for this kind of solution, there are some libraries that help you to do it in a simple way. One of them is Moment.js.
Using momentjs you can do:
const now = moment(new Date()); // Today's date
const past = moment("2014-07-07"); // Other date in the past
const duration = moment.duration(now.diff(past));
// Gets the difference in days
const days = duration.asDays();
But what I really like is the doityourself.js method, without dependencies, because the task is not so difficult and why add unnecessary dependencies?
Do it yourself: The code below shows a complete example with pure JavaScript. In the following topics, I explain each step and I can help you in case the solution below is still not useful for your case.
const now = new Date(); // Today's date
const past = new Date('2014-07-07'); // Other date in the past
const diff = Math.abs(now.getTime() - past.getTime()); // Subtract one date from the other
const days = Math.ceil(diff / (1000 * 60 * 60 * 24)); // Divide the total by the total of milliseconds corresponding to 1 day. (1000 milliseconds = 1 second).
// Shows the difference in days
console.log('Between 07/07/2014 and now it\'s been ' + days + ' days');
Step by step of how to calculate
Now let's break the above script in a few steps to understand how our script worked and also show other examples in case you need them.
The first step is to have 2 dates, and this can be the most difficult step if we don't already have them in the right format, because we'll need the dates to be converted to a format that our code can read, that is, a format that can be initialized with new Date() and that can be recognized as a date.
There are at least 5 ways to initialize a Date object in JavaScript:
// Date and time now
new Date();
// The date from a timestamp (integer value in milliseconds since 01/01/1970)
new Date(1554539293261);
// The date initialized from another Date object
var outroDia = new Date('2018-10-11 12:30');
new Date(outroDia);
// The date initialized from a valid date string
new Date('October 11 2018 12:30');
new Date('2018-10-11 12:30');
// The date initialized from Date constructor (year, month - 1, day, hour, minute, second, millisecond)
new Date(2018, 09, 11, 12, 30);
Any of the above formats for initializing our dates is valid. So if you have a date, e.g. "03/30/2019", you can't turn it into a Date() right away without parsing it before.
But if that is your case, I will facilitate the process of how to do that. Basically, you'll need:
// Let's say this is your date format dd/mm/yyyy
let date = '30/03/2019';
// We need to break the string to get each part
const dataSplit = date.split('/');
const day = dataSplit[0]; // 30
const month = dataSplit[1]; // 03
const year = dataSplit[2]; // 2019
// Now we can initialize the Date object. Note that the month starts at 0, so we do -1.
date = new Date(year, month - 1, day);
The above script helps you to convert the dd/mm/yyyy format to Date object. If you also need the hour, minute and second (ex: 30/03/2019 12:30:30), just make two other splits (on " " and on ":"), to divide the time.
Making the conversion if necessary on the two dates, the next step is the simplest of all and it's universal. You need to convert the dates in milliseconds (the getTime() method does this for you) and then get the difference between these two values.
We will also use the Math.abs method which returns the absolute value of the difference, so it doesn't matter if I put the older date before the most recent one.
// ...
const diff = Math.abs(date1.getTime() - date2.getTime());
Now the last step is just defining in which format I want the difference between the dates.
In the full script, I showed you how to get the difference in days, but you can display it in any format. I also used Math.ceil to round up if the result was fractional.
In the code above I did the following calculation:
// ...
const days = Math.ceil(diff / (1000 * 60 * 60 * 24));
// 1000 is the number of milliseconds in 1 second
// 60 seconds in a minute
// 60 minutes in an hour
// 24 hours in a day
// 1.a Multiply everything and you get the number of milliseconds in a day
// 1.b Use this constant if you prefer 86400000.
// 2. Divide by the difference between the two dates in milliseconds and you get the number of days as a result
So if I wanted to know the difference in hours, I'd just divide it by (1000 * 60 * 60). If I wanted to know in years I'd do (1000 * 60 * 60 * 24 * 365), and so on.
I think it's pretty clear how it all works here. The calculation between dates is quite simple in theory. But you may have searched this article to understand how the conversion is done. I hope my article was helpful.
