Як перетворити секунди в HH: mm: ss в moment.js


94

Як конвертувати секунди HH:mm:ss?

На даний момент я використовую функцію нижче

render: function (data){
     return new Date(data*1000).toTimeString().replace(/.*(\d{2}:\d{2}:\d{2}).*/, "$1");;
}

Це працює на chrome, але у firefox впродовж 12 секунд я розумію, 01:00:12 що хотів би використовувати moment.js для сумісності між браузерами

Я спробував це, але не працює

render: function (data){
         return moment(data).format('HH:mm:ss');
}

Що я роблю не так?

РЕДАГУВАТИ

Мені вдалося знайти рішення без moment.js, яке є наступним

return (new Date(data * 1000)).toUTCString().match(/(\d\d:\d\d:\d\d)/)[0];

Все ще цікаво, як я можу це зробити у moment.js



@mplungjan Вибачте, що не згадав, що я вже читав цю публікацію. Мені потрібно зробити таблицю з мільйонами рядків, і рішення там занадто повільне. друга відповідь - це саме те, що я написав у своєму питанні, але створює проблеми у Firefox
QGA

2
@QuentinTanioartino, отже, 4 тривіальні математичні оператори є проблемою для завдання мутації DOM для мільйонів елементів? Ви впевнені, що правильно розумієте проблему з продуктивністю?
zerkms

@zerkms добре, я знаю, що мої класи DAO повинні бути переписані для обслуговування вже перетворених даних. Це питання, про яке я знаю. Сказав, що я цілком задоволений поточними показниками моєї першої спроби, але коли я маю 5 математичних операцій для перетворення, що трохи сповільнює систему. Так, я погоджуюся з вами, що це лише швидке тимчасове рішення
QGA

@QuentinTanioartino "дещо сповільнює систему" --- "трохи" - це не те, як ви міркуєте про продуктивність. Це вузьке місце? Це доведено як вузьке місце? Якщо ні - що спонукає вас оптимізувати саме цю операцію?
zerkms

Відповіді:


80

З цього допису я спробував би це уникнути проблем зі стрибками

moment("2015-01-01").startOf('day')
    .seconds(s)
    .format('H:mm:ss');

Я не запускав jsPerf, але я думаю, це швидше, ніж створення нових об'єктів дати мільйон разів

function pad(num) {
    return ("0"+num).slice(-2);
}
function hhmmss(secs) {
  var minutes = Math.floor(secs / 60);
  secs = secs%60;
  var hours = Math.floor(minutes/60)
  minutes = minutes%60;
  return `${pad(hours)}:${pad(minutes)}:${pad(secs)}`;
  // return pad(hours)+":"+pad(minutes)+":"+pad(secs); for old browsers
}


2
Велике спасибі, дуже розумне рішення
QGA

1
Другий, надзвичайно швидкий
QGA

1
Ви можете зробити це у другому прикладі: return [години, хвилини, секунди] .filter (t => t) .map (pad) .join (":")
Онно Фабер,

@OnnoFaber Що ти вважаєш найшвидшим? конкатенація чи фільтр плюс карта? Ми також могли б це зробити`${pad(hours)}:${pad(minutes)}:${pad(secs)}`
mplungjan

З усіх попередніх відповідей найпростішою є відповідь mplungjan , але вона має помилку, яка показує випадкові числа, якщо значення має мілісекунди (наприклад: 17,3 с). На основі його коду я пропоную наступне: функціональна панель (num) {return ("0" + num) .slice (-2); } / ** * @return {рядок} * / / експортувати функцію за замовчуванням renderUserTime (секунди) {let minutes = Math.floor (seconds / 60); const outputSecs = Math.round (секунди% 60); нехай години = Math.floor (minutes / 60); const outputMinutes = Math.round (хвилин% 60); return `$ {pad (години)}: $ {pad (outputMi
Альберто Сото,

98

Це схоже на відповідь mplungjan, на яку посилається інший пост, але більш стислий:

const secs = 456;

const formatted = moment.utc(secs*1000).format('HH:mm:ss');

document.write(formatted);
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>

Він страждає від тих самих застережень, наприклад, якщо секунди перевищують один день (86400), ви не отримаєте того, що очікували.


1
дякую, я вважаю, що це дуже поширена потреба, відкрийте запит на витяг до moment.js, вони повинні його включити.
Morris S,

Дякую @Sophie. Мало де згадується utc (), саме те, що було потрібно в моєму випадку.
Пмонт

25

Ви можете використовувати плагін у форматі момент-тривалість :

var seconds = 3820;
var duration = moment.duration(seconds, 'seconds');
var formatted = duration.format("hh:mm:ss");
console.log(formatted); // 01:03:40
<!-- Moment.js library -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>

<!-- moment-duration-format plugin -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-duration-format/1.3.0/moment-duration-format.min.js"></script>

Дивіться також цю Скрипку

Upd: Щоб уникнути обрізки для значень менше 60 с, використовуйте { trim: false }:

var formatted = duration.format("hh:mm:ss", { trim: false }); // "00:00:05"

Існує компроміс, на який потрібно розглянути свою відповідь та відповідь @ sophie. Хоча технічно ваше рішення відображатиме тривалість "Часу" як hh: mm: ss, для цього потрібен додатковий плагін. Софі - це "Дата" з поточного моменту часу, відформатована до hh: mm: ss. Якщо ви видалите "utc" із Sophie, він може повернути неправильну інформацію, оскільки в якості дати використовується дата, а не поточний момент часу. Обидві відповіді працюють. Просто над чим подумати і зрозуміти.
Майкл

Хоча тут використовується CDN і багато іншого, що може додати збільшену затримку, загалом небезпечно думати про "включення іншої бібліотеки" як про негативний компроміс проти реалізації коду самостійно. Це пастка, на яку я бачу, в яку потрапляють багато розробників, і в кінцевому підсумку закінчується менш ремонтопридатним кодом.
cytinus

чомусь, якщо секунди <60, то це просто закінчується неформатованим
Даніель Лізік,

@DanielLizik, просто додай {trim: false}. Наприклад: duration.format ("hh: mm: ss", {trim: false});
Олексій Качинський

16
var seconds = 2000 ; // or "2000"
seconds = parseInt(seconds) //because moment js dont know to handle number in string format
var format =  Math.floor(moment.duration(seconds,'seconds').asHours()) + ':' + moment.duration(seconds,'seconds').minutes() + ':' + moment.duration(seconds,'seconds').seconds();

1

Як правильно використовувати тривалість moment.js? | Використовуйте moment.duration () у кодах

По-перше, потрібно імпортувати momentі moment-duration-format.

import moment from 'moment';
import 'moment-duration-format';

Потім використовуйте функцію тривалості. Застосуємо наведений вище приклад: 28800 = 8 ранку.

moment.duration(28800, "seconds").format("h:mm a");

🎉 Ну, у вас немає помилок вищезазначеного типу. 🤔Чи отримуєте ви правильне значення о 8:00 ранку? Ні ..., ви отримаєте 8:00. Формат Moment.js не працює, як передбачається.

SolutionРішення полягає у перетворенні секунд у мілісекунди та використанні часу UTC.

moment.utc(moment.duration(value, 'seconds').asMilliseconds()).format('h:mm a')

Гаразд, зараз ми о 8:00. Якщо ви хочете 8 ранку замість 8:00 ранку для інтегрального часу, нам потрібно зробити RegExp

const time = moment.utc(moment.duration(value, 'seconds').asMilliseconds()).format('h:mm a');
time.replace(/:00/g, '')

1

До 24 годин. Як Duration.formatзастаріло, з moment@2.23.0

const seconds = 123;
moment.utc(moment.duration(seconds,'seconds').as('milliseconds')).format('HH:mm:ss');

1

Моє рішення для зміни секунд (числа) на формат рядка (наприклад: 'mm: ss'):

const formattedSeconds = moment().startOf('day').seconds(S).format('mm:ss');

Напишіть свої секунди замість "S" у прикладі. І просто використовуйте 'formattedSeconds' там, де вам потрібно.

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.