JavaScriptの時間を0パディングする方法

JavaScriptの時間を0パディングする方法

Posted at May 16,2018 12:03 AM
Tag:[JavaScript]

JavaScriptの時間を0パディングする方法を紹介します。

JavaScriptの時間を0パディングする

1.問題点

下記の、今日の年月日を表示する簡単なサンプルを作ってみました。

var date = new Date();
var year = date.getFullYear();
var month = date.getMonth()+1;
var day = date.getDate();
alert(year + '/' + month + '/' + day);

このスクリプトを実行すると、"2018/5/15"のように表示されます。

できれば、"2018/05/15"のように、月や日が1桁のときに0パディングしたいのですが、方法が分かりません。

ということで、JavaScriptの時間を0パディングする方法を紹介します

2.JavaScriptの時間を0パディングする

JavaScriptの時間を0パディングするには、スクリプトに赤色の2行を追加します。

var date = new Date();
var year = date.getFullYear();
var month = date.getMonth()+1;
var day = date.getDate();
month = ('0' + month).slice(-2);
day = ('0' + day).slice(-2);
alert(year + '/' + month + '/' + day);

slice()は、文字列の中から、指定した開始位置から終了位置までの部分を返却するメソッドです。

foo = 'abc';
alert(foo.slice(0,2));

と書けば、変数fooの左から数えて0番目から2文字、つまり"ab"を取り出します。

このように、通常はslice()のパラメータに正の値を設定しましが、負の値を設定すれば、右側から取得してくれます。

foo = 'abc';
alert(foo.slice(-2));

と書けば、変数fooの右端から数えて2文字、つまり"bc"を取り出します。

この機能を利用して、

month = ('0' + month).slice(-2);

と書くことで、monthが1~9の場合は2桁になるよう0パディング、10~12の場合は加えた0をはずして2桁にします。

関連記事
トラックバックURL


コメントする
greeting

*必須

*必須(非表示)


ご質問のコメントの回答については、内容あるいは多忙の場合、1週間以上かかる場合があります。また、すべてのご質問にはお答えできない可能性があります。予めご了承ください。

太字イタリックアンダーラインハイパーリンク引用
[サインインしない場合はここにCAPTCHAを表示します]

コメント投稿後にScript Errorや500エラーが表示された場合は、すぐに再送信せず、ブラウザの「戻る」ボタンで一旦エントリーのページに戻り(プレビュー画面で投稿した場合は、投稿内容をマウスコピーしてからエントリーのページに戻り)、ブラウザをリロードして投稿コメントが反映されていることを確認してください。

コメント欄に(X)HTMLタグやMTタグを記述される場合、「<」は「&lt;」、「>」は「&gt;」と入力してください。例えば「<$MTBlogURL$>」は「&lt;$MTBlogURL$&gt;」となります(全て半角文字)