How to Convert Minutes to Hours and Minutes in JavaScript

To convert minutes to hours and minutes in JavaScript, divide the minutes by 60. The hours will be the whole number of the result, and the minutes will be the remainder of the division.

For example:

function toHoursAndMinutes(totalMinutes) {
  const hours = Math.floor(totalMinutes / 60);
  const minutes = totalMinutes % 60;

  return { hours, minutes };
}

// { hours: 1, minutes: 40 }
console.log(toHoursAndMinutes(100));

// { hours: 1, minutes: 0 }
console.log(toHoursAndMinutes(60));

// { hours: 2, minutes: 10 }
console.log(toHoursAndMinutes(130));

We create a reusable function that takes the total number of minutes and returns an object containing the separate hour and minute values.

First, we divide the total minutes by 60 to get the number of full hours. The division will result in a floating point number, so we use the Math.floor() function to get just the whole number of the quotient.

Math.floor() returns the largest integer less than or equal to a specified number.

console.log(Math.floor(10.95)); // 10
console.log(Math.floor(10)); // 10
console.log(Math.floor(10.05)); // 10

After this, we use the modulo operator (%) to get the remainder of dividing the total minutes by 60. The result is the remaining minutes.

console.log(100 % 60); // 40
console.log(60 % 60); // 0
console.log(130 % 60); // 10

We return an object with hour and minute properties having values of the full hours and remaining minutes respectively.

Convert minutes to time string (HH:mm)

We could also return results in other formats, depending on our use case. For example, we could return the hours and minutes as a time string in a format like HH:mm, where two digits are used for both the hours and the minutes.

function toHoursAndMinutes(totalMinutes) {
  const hours = Math.floor(totalMinutes / 60);
  const minutes = totalMinutes % 60;

  return `${padToTwoDigits(hours)}:${padToTwoDigits(minutes)}`;
}

function padToTwoDigits(num) {
  return num.toString().padStart(2, '0');
}

console.log(toHoursAndMinutes(100)); // 01:40
console.log(toHoursAndMinutes(60)); // 01:00
console.log(toHoursAndMinutes(130)); // 02:10

Here we use the padStart() method to pad the hour and minute values with zeroes if they are single digits.

The String padStart() method pads the current string with another string as many times as needed until the resulting string reaches the specified length.

const str1 = '7';
const str2 = 'abc';

console.log(str1.padStart(3, '0')); // 007
console.log(str2.padStart(5, '*')); // **abc
console.log(str2.padStart(3, '*')); // abc

The string we return is of the time format HH:mm, but you can use another format to suit your use case.

Return string with abbreviated labels

In the following example, we return a string containing the full hour indicated with an h, and the remaining minutes indicated with an m (if it exists):

function toHoursAndMinutes(totalMinutes) {
  const hours = Math.floor(totalMinutes / 60);
  const minutes = totalMinutes % 60;

  return `${hours}h${minutes > 0 ? ` ${minutes}m` : ''}`;
}

console.log(toHoursAndMinutes(100)); // 1h 40m
console.log(toHoursAndMinutes(60)); // 1h
console.log(toHoursAndMinutes(130)); // 2h 10m

We use the ternary operator to ensure that the remaining minutes are more than zero before displaying them with the abbreviation.

11 Amazing New JavaScript Features in ES13

This guide will bring you up to speed with all the latest features added in ECMAScript 13. These powerful new features will modernize your JavaScript with shorter and more expressive code.