以前、JavaScriptで日付を扱う方法について紹介しました。
JavaScriptには、日付を扱う有名なライブラリー「moment.js」があります。
Githubで３９６３０ものスターを(2018年12月26日現在)獲得しているライブラリーです。
今回の記事では、Moment.jsの使用方法について紹介します。
インストール
Moment.jsのインストールは、npmやYarnなどでインストールすることができますが、次のコマンドを打つことでインストールすることができます。
npm install moment --save # npm yarn add moment # Yarn Install-Package Moment.js # NuGet spm install moment --save # spm meteor add momentjs:moment # meteor bower install moment --save # bower (deprecated)
また、Moment.jsのCDNを使用する方法もあります。
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.23.0/locale/ja.js"></script>
Moment.jsの使用方法
日付時刻のインスタンスの生成
Moment.jsでは、日付をの生成を配列・オブジェクト・UNIXタイムスタンプなど様々な方法で取得することができます。
Moment.jsを使用した日付のフォーマット
| トークン | 指定の意味 | 例 |
|---|---|---|
| M | 月の数字（1 – 12） | １〜12 |
| MM | 月の数字（01 – 12） | 01〜12 |
| MMMあるいはMMMM | moment.locale()でローカライズされた月の名前 | 1月〜12月 |
| D | 日（月：たとえば10月の何日目 1 – 31） | １〜31 |
| DD | 日（月：たとえば10月の何日目 01 – 31） | 01〜３１ |
| DDDあるいはDDDD | 日（年：たとえば2010年の何日目） | 1〜366 |
| d, dd, dddあるいはdddd | moment.locale()でローカライズされた曜日 | 月〜日 |
| YY | 2ケタの年数（もし70以上であれば、1900年代か、そうでなければ2000年代を返す） | 19 |
| YYYY | 4ケタの年数 | 2019 |
| aあるいはA | AM／PM | am/pm |
| H, HH | 時間（24時制） | 0〜23 |
| hあるいはhh | 時間（12時制、aあるいはAと組み合わせて使用） | 1〜12 |
| mあるいはmm | 分 | 0〜59 |
| sあるいはss | 秒 | 0〜59 |
| S | デシ秒（1/10秒） | 0〜59 |
| SS | センチ秒（1/100秒） | 0〜59 |
| SSS | ミリ秒（1/1000秒） | 0〜999 |
| ZあるいはZZ | +0700あるいは+07:30などタイムゾーンの時差。タイムゾーンが指定されていない限り、文字のパースは現在のタイムゾーンでdateを作る。 |
+12:00 |
年や月単位で日時を取得
Moment.jsでは月だけの情報が欲しい場合や設定する場合も簡単に行うことが出来ます。月は-1されるのに注意が必要です。
そのほかにgetメソッドを使用する方法もあります。
Moment.jsで作成したインスタンスに新たな日付をセットするためにsetメソッドを使用する方法もあります。
指定日までの日時を知る(fromNow)
現在からの指定日までの期間を知る
Moment.jsを使用すると今と指定日までの日数を簡単に知ることができます。
fromNowメソッドを使用します。
詳細に日時を指定の場合は、下記のリンクを参照ください。
Time from now 1.0.0+
指定日と指定日の期間を知る
日時の加算・減算をする
Moment.jsを使用すると日付の加算・減算も簡単にすることが出来ます。
下記の例では、年・月・日の減算ですが、引数に”hours”・”seconds”を与えることで、時間・秒の加算・減算も当然行うことが出来ます。
年始めや月初などの取得
moment.jsを使用して年初・月初を取得することが出来ます。
年末・月末などの取得
moment.jsを使用すると年末や月末の情報も簡単に取得することが出来ます。
日付日時の比較
日時が同じかどうか(isSame)
日時が前かどうか(isBefore)
日時が前かどうかを比較することもできます。以前出ないことに注意です。
日時が後かどうか(isAfter)
以前(isSameOrBefore)
以後(isSameOrAfter)
間(isBetween)
今回は、JavaScriptで日付日時を扱うライブラリー「Moment.js」について紹介しました。
「Moment.js」を使用しようと思っている方は、ぜひ、参考にしてください。