ITエンジニアの技術メモ

神奈川在住のITエンジニアの備忘録です。おもにプログラミングやネットワーク技術について、学んだことを自分の中で整理するためにゆるゆると書いています。ちゃんと検証できていない部分もあるのでご参考程度となりますが、誰かのお役に立てれば幸いです。

Javascript で現在時刻を見やすく出力する。

デバッグの一環で、javascript で現在時刻を入れたログをブラウザのコンソールに出力しようとしたら、現在時刻の取得&見やすい形への整形がちょっと面倒だったので、それ用の関数 getCurrentTimeStr() を作成した。これを呼ぶと、戻り値として「2019/04/07 22:17:12.090」のように、人に優しい形式で現在時刻を返す。
以下は、getCurrentTimeStr() を使ったサンプル。

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="content-language" content="ja">
        <meta charset="UTF-8">
        <title>現在時刻</title>
        <script>
            function showCurrentTime() {
             document.getElementById('currentTime').innerHTML = getCurrentTimeStr();
            }

            function getCurrentTimeStr() {
                var currentTime = new Date();
                var year = currentTime.getFullYear();
                var mon = currentTime.getMonth() + 1;
                var day = currentTime.getDate();
                var hour = currentTime.getHours();
                var min = currentTime.getMinutes();
                var sec = currentTime.getSeconds();
                var millsec = currentTime.getMilliseconds();
                
                if(mon < 10) {
                    mon = "0" + mon;
                }
                if(day < 10) {
                    day = "0" + day;
                }
                if(hour < 10) {
                    hour = "0" + hour;
                }
                if(min < 10) {
                    min = "0" + min;
                }
                if(sec < 10) {
                    sec = "0" + sec;
                }
                if(millsec < 10) {
                    millsec = "00" + millsec;
                }
                else if (10 <= millsec && millsec < 100) {
                    millsec = "0" + millsec;
                }
                
                var currentTimeStr = year + "/" + mon + "/" + day + " " + hour + ":" + min + ":" + sec + "." + millsec;
                return currentTimeStr;
            }
        </script>
    </head>
    <body>
        <input type="button" value="現在時刻" onclick="showCurrentTime()">
        <div id="currentTime"></div>
    </body>
</html>

getCurrentTimeStr() 内では、桁数が揃うように、必要に応じて上位の桁を "0" で埋めている。