How to calculate hours between two dates JavaScript?

Time difference between two time fields on the same day

To calculate the difference between two time fields in hours, minutes, or seconds, use the following formula:

getTimeDiff('{time_variable_2}', '{time_variable_1}', 'm');

where time_variable_1 is the first time point (time field) and time_variable_2 is the second time point. Replace these with your own variable names.

You can also change the units of time:

• For hours: use 'h' instead of 'm'
• For seconds: use 's' instead of 'm'

Since time fields capture only hours and minutes, this difference will always be rounded to the nearest 60 sec.

Note: This formula is valid only if the two times are on the same date. 

Time difference between two time fields on two consecutive dates

If the two times are on two consecutive days, you can use one of the following calculations, depending on whether you want the outcome in hours, minutes, or both. This template requires the times to be filled in in a 24 hour format. This difference will be rounded to the nearest 60 sec.

There are so many things that you could do with a date & time calculator. With a date & time calculator, you can calculate how many days it may take for delivery to arrive, how many months it may take for a subscription to expire, or maybe you want to build your own time calculator like this Amazing App, name it …

In this article, I will show you how you can create a simple function that will help to calculate the difference between two dates.

I will call the function calDate() short for ‘calculateDate’.

This function will have 2 parameters which are date1 and date2 and these 2 dates must be in the format MM-DD-YYYY (Month-Day-Year), to avoid errors during calculation.

I love writing dates in the format DD-MM-YYYY, but in this article, I happen to not be in support of this guy 😅.

Now, let's start off with the function.

I will create a new instance of aDate object and find the timestamps of both dates

Next, we have to prevent negative values as we subtract a higher timestamp from a lower timestamp because this can ruin our result.

I will use a condition to check which timestamp is greater and then swap them, as you can see on line 18.

I have passed the result of subtracting timestamp 2 from timestamp 1 as an argument to a new date instance in order for JavaScript to convert the resulting timestamp to date.

Next, we have to retrieve the days, months, and years from the result and then join them with a hyphen. This will help us to convert it to an array that we will read from later.

If you observed the code above, you’ll notice that I added +1 to the getMonth() method.

This is because JavaScript counts months from a zero index, this means that 0 — 11 is January up to December, so

• 0 is for January
• 1 is for February
• up to 11 for December.

On line 26, I drafted how the array would look like, with the format DD-MM-YYYY, then on line 28, I used the split method to convert the draft to an array.

The array was created in this format:

• At position 0 is the Day
• At position 1 is the Month
• At position 2 is the Year

We will subtract each member of this array from the default date which is (01–01 -1970). This will help us know the number of days, months, and years that have elapsed.

We also need to set up a custom text that will help to prevent errors in counting like; 1 years ago or 1 months ago.

Now if you search for how many days there are in 6 months, you would get the formula that we will use to get the total number of days between the two dates.

FINDING THE TOTAL NUMBER OF DAYS ELAPSED

Let’s find the total number of days by converting the years and months to days, then we will sum the result with the already existing days from the calculation.

I will check if the number of years that have elapsed is equal to 1, then I will show the custom text as a year. For Eg 1 year.

But if the number of years that have elapsed is greater than 1, I will show the custom text as years. Otherwise, I will not show any value.

Note: I used a Tenary Operator to simplify the logic.

Let’s round off the total days to the nearest integer because there is a 95% possibility that the result will end up as a number with a decimal. I will use the math method Math.round() to achieve this, and then I will return the result as an object.

I will use the dates below:

• date 1 = today (m-d-y) = 11–19–2021
• date 2 = future (m-d-y) = 12–12–2026

This is the output:

We have 5 years and 23 days left till the 12th of December 2026.

Now if you use an external App like time and date for the same calculation, you should get if not approximate, the same value.

EXTENDING THE CALCULATOR

Since we are able to calculate the total days that have elapsed, we can extend the calculator to calculate the;

• total number of seconds
• total number of minutes
• total number of hours and
• total number of weeks

So when I call the function to calculate the date difference between today (08–04–2022) and the same future date (12–12–2026), this is the result.

So from the calculation, we still have 4 years, 4 months & 10 days left till the 12th of December 2026.

So that’s a basic setup for a function that helps to calculate the difference between two dates.

Don’t build web monoliths. Use Bit to create and compose decoupled software components — in your favorite frameworks like React or Node. Build scalable frontends and backends with a powerful and enjoyable dev experience.

Bring your team to Bit Cloud to host and collaborate on components together, and greatly speed up, scale, and standardize development as a team. Start with composable frontends like a Design System or Micro Frontends, or explore the composable backend. Give it a try →

How do you calculate the difference in hours between two dates?

How to calculate number of hours in JavaScript?

How to get hour minute and second from the date () in JavaScript?

How do I calculate hours between two dates in typescript?