秒をmoment.jsでHH:mm:ssに変換する方法


93

秒をどのように変換できHH:mm:ssますか?

現在、私は以下の機能を使用しています

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

これはクロムで動作しますが、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私がすでにその投稿を読んだことを言及しなかったことをお詫びします。何百万もの行を持つテーブルをレンダリングする必要があり、その解決策は遅すぎます。2番目の答えは、私の質問に書いたとおりですが、Firefoxで問題が発生します
QGA

2
@QuentinTanioartinoなので、4つの単純な数学演算子は、何百万もの要素のDOMを変更するタスクの問題ですか?パフォーマンスの問題を正しく理解していますか?
zerkms 2015

@zerkmsよく知っているDAOクラスは、既に変換されたデータを提供するために書き換える必要があることを知っています。これは私が気付いている問題です。私は最初の試みの現在のパフォーマンスに非常に満足していると言いましたが、システムを少し遅くする変換のために5つの数学演算があるとき。はい、私はこれが単なる
一時的

@QuentinTanioartino "それはシステムを少し遅くします" --- "少し"はパフォーマンスについてあなたが推論する方法ではありません。それはボトルネック?それはボトルネックであることが証明されていますか?そうでない場合-この操作を最適化する動機は何ですか?
zerkms 2015

回答:


78

このポスト私は飛躍の問題を回避するために、これをしようとするだろう

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

私はjsPerfを実行しませんでしたが、これは新しい日付オブジェクトを100万回作成するよりも速いと思います

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
非常に
優れた

1
2つ目は、非常に高速です
QGA 2015

1
これは2番目の例で実行できます。return [時間、分、秒] .filter(t => t).map(pad).join( ":")
Onno Faber

@OnnoFaber何が一番速いと思いますか?連結またはフィルターとマップのどちらですか?私たちもできる`${pad(hours)}:${pad(minutes)}:${pad(secs)}`
mplungjan

以前のすべての回答から、最も単純なのはmplungjanの回答ですが、値にミリ秒(17.3秒など)がある場合、乱数を示すエラーが発生します。彼のコードに基づいて、以下を提案します。function pad(num){return( "0" + num).slice(-2); } / ** * @return {string} * / export default function renderUserTime(seconds){let minutes = Math.floor(seconds / 60); const outputSecs = Math.round(seconds%60); let時間= Math.floor(分/ 60); const outputMinutes = Math.round(分%60); `$ {pad(hours)}:$ {pad(outputMi
Alberto Soto

94

これは別の投稿から参照された回答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>

同じ警告に悩まされています。たとえば、秒数が1日(86400)を超えると、期待どおりの結果が得られません。


1
ありがとう、私はこれが非常に一般的なニーズだと思います、彼らがそれを組み込むはずのmoment.jsへのプルリクエストを開きます。
Morris S

@ソフィーありがとう。utc()について言及している場所はほとんどありません。utc()は、私の場合にまさに必要だったものです。
pmont 2018

24

moment-duration-formatプラグインを使用できます。

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として表示しますが、追加のプラグインが必要です。Sophieは、hh:mm:ssにフォーマットされた現在の時点からの「日付」です。ソフィーから「utc」を削除すると、現在の時点ではなくエポックを日付として使用するため、誤った情報が返される可能性があります。どちらの答えも機能します。考えて理解するだけの何か。
Michael

ここでCDNを使用するとレイテンシが増加する可能性がありますが、「別のライブラリを含める」ことを、コードを自分で実装することと比較して、マイナスのトレードオフと考えることは一般に危険です。これは、多くの開発者が陥り、最終的に保守性の低いコードに陥るのを私が見る罠です。
キチヌス

何らかの理由で、秒数が60未満の場合、フォーマットされないままになります
Daniel Lizik

@DanielLizik、{trim:false}を追加するだけです。例:duration.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

moment.jsの継続時間を正しく使用するにはどうすればよいですか? | コードでmoment.duration()を使用する

まず、とをインポートする必要がmomentありmoment-duration-formatます。

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

次に、期間関数を使用します。上記の例を適用してみましょう:28800 = 8 am。

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

🎉まあ、あなたは上記のタイプエラーはありません。8正しい値は午前8時00分ですか?いいえ、得られる値は8:00です。Moment.js形式が想定どおりに機能していません。

💡解決策は、秒をミリ秒に変換し、UTC時間を使用することです。

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

了解しました。午前8時です。午前8時ではなく午前8時が必要な場合は、RegExpを実行する必要があります。

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

1

24時間まで。Duration.formatmoment@2.23.0で、推奨されていません

const seconds = 123;
moment.utc(moment.duration(seconds,'seconds').as('milliseconds')).format('HH:mm:ss');
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.