Как конвертировать секунды в минуты и часы с помощью vanilla JS 

Работать со временем в JavaScript может быть не простой. Сегодня я покажу вам, как конвертировать секунды в минуты и часы с помощью vanilla JS.

Конвертирование часов

Допустим, у вас была метка времени в секундах, которую вы хотели отобразить в HH:MM:SS формате.

var timestamp = 9462;

60 секунд в минуту и ​​60 минут в час. Мы делим свой timestamp дважды на 60. В результате мы получаем 2.6283.

var timestamp = 9462;

// 2.628333333
var hours = timestamp / 60 / 60;

Мы можем использовать Math.floor() для округления до ближайшего целого числа чтобы получить количество часов в int.

var timestamp = 9462;

// 2
var hours = Math.floor(timestamp / 60 / 60);

Преобразование минут

В минуте есть 60 секунд. Давайте разделим наш timestamp на 60 и используем, Math.floor() чтобы округлить до ближайшего целого числа. Это вернет нам 157, потому что это также включает в себя все минуты, которые в нашем hours.

var timestamp = 9462;

// 2
var hours = Math.floor(timestamp / 60 / 60);

// 157
var minutes = Math.floor(timestamp / 60);

Мы умножим наш hours на, 60 чтобы получить его значение в минутах, а затем вычтем его из нашего, minutes чтобы получить правильное значение.

var timestamp = 9462;

// 2
var hours = Math.floor(timestamp / 60 / 60);

// 37
var minutes = Math.floor(timestamp / 60) - (hours * 60);

Подсчет секунд

Наконец, давайте посчитаем секунды.

Для этого, мы можем использовать оператор остатка от деления. Он возвращает сумму, оставшуюся после деления на число.

Мы будем использовать его для деления timestamp на 60 (количество секунд в минуте). Число, которое мы получаем, - это секунды после удаления всех минут.

var timestamp = 9462;

// 2
var hours = Math.floor(timestamp / 60 / 60);

// 37
var minutes = Math.floor(timestamp / 60) - (hours * 60);

// 42
var seconds = timestamp % 60;

Форматирование времени

Теперь, когда у нас есть свои hours, minutes и seconds мы готовы отформатировать их в наш формат HH:MM:SS.

Мы можем для этого использовать простую конкатенацию строк.

// 2:37:42
var formatted = hours + ':' + minutes + ':' + seconds;

Это может быть достаточно хорошо, но что, если вы хотите вести 0 в hours? Что если наши minutes или seconds однозначные числа?

Мы можем преобразовать наши числа в строки и использовать метод padStart() для обеспечения минимального количества цифр.

// 02:37:42
var formatted = [
  hours.toString().padStart(2, '0'),
  minutes.toString().padStart(2, '0'),
  seconds.toString().padStart(2, '0')
].join(':');