Преобразование секунд в формат времени HH:MM:SS в JavaScript

Пройдите тест, узнайте какой профессии подходите

Я предпочитаю
0%
Работать самостоятельно и не зависеть от других
Работать в команде и рассчитывать на помощь коллег
Организовывать и контролировать процесс работы

Быстрый ответ

Желаете изменить количество секунд на часы, минуты и секунды? Воспользуйтесь этой компактной функцией на JavaScript:

JS
Скопировать код
function toHHMMSS(secs) {
    const pad = val => ('0' + val).slice(-2);
    return [Math.floor(secs / 3600), Math.floor((secs % 3600) / 60), secs % 60]
        .map(pad)
        .join(':');
}

console.log(toHHMMSS(3665)); // Выводит "01:01:05". Время преобразовано верно!

Функция toHHMMSS позволит вам быстро произвести конвертацию времени. Просто передайте количество секунд, чтобы получить результат в формате ЧЧ:ММ:СС.

Кинга Идем в IT: пошаговый план для смены профессии

Обработка исключений: Отрицательные значения и не числовой ввод

В мире программирования отрицательные и не числовые значения встречаются так же часто, как куки в браузерах. Обрабатываем аномальный ввод следующим образом:

JS
Скопировать код
function toHHMMSS(secs) {
    if (typeof secs !== 'number' || isNaN(secs)) {
        throw new Error('Ожидалось число, а получено что-то иное.');
    }
    if (secs < 0) {
        throw new Error('Отрицательные секунды? Мы ведь не можем вернуть время назад.');
    }
    // Продолжаем преобразование...
}

Такая проверка защищает функцию от ошибок, вызванных некорректным вводом данных. Помните, что правильная обработка исключений — это профилактика от возникновения багов.

Для любителей оптимизации: Производительность с минимализмом

Мы ценим эффективность, и иногда это означает отказ от использования Date в пользу чистого JavaScript. Если вы тоже нацелены на скорость, вот оптимальное решение:

JS
Скопировать код
function toHHMMSS(secs) {
    const pad = val => String(val).padStart(2, '0');
    return [Math.floor(secs / 3600), Math.floor((secs % 3600) / 60), secs % 60]
        .map(pad)
        .join(':');
}

console.log(toHHMMSS(7265)); // И снова "02:01:05". Работает на скорость света!

Эта функция не использует объект Date и работает быстрее благодаря базовым математическим операциям. Простота и прозрачность на благо производительности.

Расширенные возможности с помощью Moment.js

Для работы со временем свыше 24 часов или сложных расчетов времени может понадобиться библиотека Moment.js:

JS
Скопировать код
function toHHMMSS(secs) {
    return moment.utc(secs * 1000).format('HH:mm:ss');
}

console.log(toHHMMSS(90000)); // Выведет "25:00:00". Мы увеличили продолжительность суток!

Moment.js предлагает дополнительные функции, однако будьте внимательны к производительности при подключении сторонних библиотек. Иногда достаточно мотоцикла, а не грузовика.

Визуализация

Представим цифровой секундомер. Мы устанавливаем на нем время, полученное после конвертации.

Входящее количество секунд: 7265

Процесс преобразования в формате секундомера:

Markdown
Скопировать код
🔢 => 🕒 (⏱️ 7265 сек)

Часы (ЧЧ): `7265 / 3600`  => `2 ч` (⏱️ теперь показывает 02:--)
Минуты (ММ): `(7265 % 3600) / 60`  => `1 мин` (⏱️ теперь показывает 02:01--)
Секунды (СС): `(7265 % 60)`  => `5 сек` (⏱️ теперь показывает 02:01:05)

Показатель на секундомере: 02:01:05

Понимание преобразования секунд в формат ЧЧ:ММ:СС схоже с настройкой цифрового секундомера.

Удобство синтаксиса с использованием стрелочных функций и деструкции массивов

Стрелочные функции делают код более лаконичным и чистым. Используем их так:

JS
Скопировать код
const toHHMMSS = secs => {
    const [hh, mm, ss] = [3600, 60, 1].map(unit => String(Math.floor(secs / unit % 60)).padStart(2, '0'));
    return [hh.trim(), mm, ss].join(':');
};

console.log(toHHMMSS(7265)); // "02:01:05". Элегантно, как спокойное воскресное утро.

Такой код выглядит элегантно и аккуратно, соответствуя современным стандартам написания кода JavaScript.

Проверка данных: Принимаем только валидные входные данные

Часто при создании функций нужно обратить внимание на проверку входных данных:

JS
Скопировать код
function toHHMMSS(secs) {
    const seconds = parseInt(secs, 10);
    if (isNaN(seconds)) {
        throw new TypeError('Ожидали целое число, а получили что-то иное.');
    }
    // Переходим к конвертации времени...
}

Проверка данных и преобразование типа данных через parseInt увеличивают надежность функции и защищают от некорректных вводных данных.

Полезные материалы

  1. Date.prototype.toLocaleTimeString() – JavaScript | MDN — детальное руководство по методу toLocaleTimeString().
  2. JavaScript seconds to time string with format hh:mm:ss – Stack Overflow — обсуждения и ответы на Stack Overflow.
  3. Javascript – Seconds to Time (hh:mm:ss,ms) -> sec2time(593.685038) becomes 00:09:53,685 · GitHub — полезный код для подобного конвертирования.
  4. Moment.js | Docs — официальная документация библиотеки Moment.js.
  5. Простой обратный таймер на JavaScript – YouTube — визуальное пособие по созданию обратного таймера.
  6. JavaScript Timing Events — об информации по временным событиям в JavaScript.
  7. Дуглас Крокфорд о JavaScript — лучшие практики применения JavaScript от эксперта в этой области.
Проверь как ты усвоил материалы статьи
Пройди тест и узнай насколько ты лучше других читателей
Что возвращает функция toHHMMSS при входном значении 3665?
1 / 5