Cara mengonversi detik ke HH: mm: ss di moment.js


94

Bagaimana cara mengubah detik menjadi HH:mm:ss?

Saat ini saya menggunakan fungsi di bawah ini

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

Ini berfungsi di chrome tetapi di firefox selama 12 detik saya mengerti, 01:00:12 saya ingin menggunakan moment.js untuk kompatibilitas lintas browser

Saya mencoba ini tetapi tidak berhasil

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

Apa yang saya lakukan salah?

EDIT

Saya berhasil menemukan solusi tanpa moment.js yaitu sebagai berikut

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

Masih penasaran bagaimana saya bisa melakukannya di moment.js



@mplungjan Maaf karena tidak menyebutkan bahwa saya sudah membaca posting itu. Saya perlu membuat tabel dengan jutaan baris dan solusinya terlalu lambat. jawaban kedua persis seperti yang saya tulis dalam pertanyaan saya tetapi memberi saya masalah di firefox
QGA

2
@QuentinTanioartino jadi 4 operator matematika sepele adalah masalah tugas mutasi DOM untuk jutaan elemen? Apakah Anda yakin Anda memahami masalah kinerja dengan benar?
zerkms

@zerkms baik saya tahu bahwa kelas DAO saya harus ditulis ulang untuk melayani data yang sudah dikonversi. Ini adalah masalah yang saya sadari. Mengatakan bahwa saya cukup senang dengan kinerja percobaan pertama saya saat ini, tetapi ketika saya memiliki 5 operasi matematika untuk konversi yang sedikit memperlambat sistem. Ya, saya setuju dengan Anda bahwa ini hanyalah solusi SEMENTARA cepat
QGA

@QuentinTanioartino "yang memperlambat sistem sedikit" --- "sedikit" bukanlah alasan Anda tentang kinerja. Apakah ini hambatan? Apakah terbukti menjadi penghambat? Jika tidak - apa yang mendorong Anda untuk mengoptimalkan operasi ini?
zerkms

Jawaban:


81

Dari posting ini saya akan mencoba ini untuk menghindari masalah lompatan

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

Saya tidak menjalankan jsPerf, tapi menurut saya ini lebih cepat daripada membuat objek tanggal baru jutaan kali

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
Terima kasih banyak, solusi yang sangat cerdas
QGA

1
Yang kedua, Sangat cepat
QGA

1
Anda dapat melakukan ini pada contoh kedua: return [jam, menit, detik] .filter (t => t) .map (pad) .join (":")
Onno Faber

@OnnoFaber Menurut Anda, apa yang tercepat? penggabungan atau filter plus peta? Kami juga bisa melakukannya`${pad(hours)}:${pad(minutes)}:${pad(secs)}`
mplungjan

Dari semua jawaban tadi, yang paling sederhana adalah jawaban mplungjan , namun terdapat error yang menunjukkan bilangan random jika nilainya dalam milidetik (misal: 17.3 s). Berdasarkan kodenya, saya mengusulkan yang berikut: function pad (num) {return ("0" + num) .slice (-2); } / ** * @return {string} * / ekspor fungsi default renderUserTime (detik) {let minutes = Math.floor (detik / 60); const outputSecs = Math.round (detik% 60); biarkan jam = Math.floor (menit / 60); const outputMinutes = Math.round (menit% 60); mengembalikan `$ {pad (jam)}: $ {pad (outputMi
Alberto Soto

98

Ini mirip dengan jawaban mplungjan yang dirujuk dari postingan lain, tetapi lebih ringkas:

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>

Itu menderita peringatan yang sama, misalnya jika detik melebihi satu hari (86400), Anda tidak akan mendapatkan apa yang Anda harapkan.


1
terima kasih, saya pikir ini adalah kebutuhan yang sangat umum, buka permintaan tarik ke moment.js mereka harus memasukkannya.
Morris S

Terima kasih @Sophie. Beberapa tempat menyebutkan utc (), yang memang dibutuhkan dalam kasus saya.
pmont

25

Anda dapat menggunakan plugin format durasi momen :

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>

Lihat juga Biola ini

Pembaruan: Untuk menghindari pemangkasan untuk nilai yang kurang dari 60 detik, gunakan { trim: false }:

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

Ada trade-off yang perlu dilihat dengan jawaban Anda dan jawaban @ sophie. Meskipun secara teknis solusi Anda akan menampilkan durasi "Waktu" sebagai jj: mm: dd, ini membutuhkan plugin tambahan. Sophie adalah "Tanggal" dari titik waktu saat ini yang diformat ke jj: mm: dd. Jika Anda menghapus "utc" dari Sophie, itu dapat mengembalikan informasi yang salah karena menggunakan epoch sebagai tanggal dan bukan titik waktu saat ini. Kedua jawaban itu berhasil. Hanya sesuatu untuk dipikirkan dan dipahami.
Michael

Meskipun di sini menggunakan CDN dan yang lainnya dapat menambah latensi, secara umum berbahaya untuk menganggap "menyertakan pustaka lain" sebagai pertukaran negatif vs. menerapkan kode sendiri. Ini adalah jebakan yang saya lihat banyak pengembang jatuh ke dalam dan akhirnya berakhir dengan kode yang kurang dapat dipelihara.
cytinus

untuk beberapa alasan jika detik <60 maka itu hanya berakhir tanpa
format

@DanielLizik, cukup tambahkan {trim: false}. Misalnya: durasi.format ("hh: mm: ss", {trim: false});
Oleksiy Kachynskyy

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

Bagaimana cara menggunakan durasi moment.js dengan benar? | Gunakan moment.duration () dalam kode

Pertama, Anda perlu mengimpor momentdan moment-duration-format.

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

Kemudian, gunakan fungsi durasi. Mari kita terapkan contoh di atas: 28800 = 8 pagi.

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

🎉Nah, Anda tidak memiliki kesalahan jenis di atas. 🤔Apakah Anda mendapatkan nilai yang benar pada jam 8 pagi? Tidak…, nilai yang Anda dapatkan adalah 8:00 a. Format Moment.js tidak berfungsi sebagaimana mestinya.

💡 Solusinya adalah mengubah detik menjadi milidetik dan menggunakan waktu UTC.

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

Baiklah kita bangun 8:00 sekarang. Jika Anda ingin 8 pagi dan bukan 8:00 untuk waktu integral, kita perlu melakukan RegExp

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

1

Sampai 24 jam. Seperti yang Duration.formatsudah usang, dengan moment@2.23.0

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

1

Solusi saya untuk mengubah detik (angka) ke format string (misalnya: 'mm: ss'):

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

Tuliskan detik Anda, bukan 'S' sebagai contoh. Dan cukup gunakan 'formattedSeconds' di tempat yang Anda butuhkan.

Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.