Momentと比較してみて
使ってみて1週間ほど経た感想です。v0.2.9を利用。
気に入ったところ
- Immutability
- momentのように
clone
メソッドが不要const bar = foo.clone().add(1, 'month')
- momentのように
- 月を
1
から12
で計算できる- momentはネイティブのDateと同様に
0
スタート
- momentはネイティブのDateと同様に
- ネイティブのIntl APIを利用している
- moment-timezoneが不要
- 各localeファイルが不要
- 柔軟なフォーマットで表示できる(曜日も追加したい、など)
- moment-timezoneが不要
- オブジェクト作成時に元データ(元フォーマット)に応じて複数のメソッドが用意されている
- 厳格なパース
- 単純な値の取得はgetterで統一
dateTime.year()
に対してdateTime.year
- 出力フォーマットの拡充
dt.toISODate(); //=> '2017-04-20'
など- https://moment.github.io/luxon/docs/manual/moment.html#output
なるほどと思ったところ
- setterを集約
dateTime.year(2016).month(4)
からdateTime.set({year: 2016, month: 4})
へ
その他のmomentとの違い
準備
TypeScriptの場合。
型定義ファイル
まだ用意されていないので、このあたりからUse Flow or Typescript · Issue #73 · moment/luxon · GitHub拾ってくる。
npm i @types/luxon
インポート
import { DateTime } from 'luxon';
基本的な書き方
作成
// 現在時刻 const now = DateTime.local(); // 特定の時刻 const dt = DateTime.local(2017, 5, 15, 8, 30); // 特定フォーマットから作成 DateTime.fromISO('2017-05-15') DateTime.fromMillis('1494774000000') // など
https://moment.github.io/luxon/docs/manual/tour.html#creating-a-datetime
https://moment.github.io/luxon/docs/manual/parsing.html
変更
DateTime.fromISO('2017-05-15').plus({months: 2, days: 6}).toISODate(); //=> '2017-07-21'
https://moment.github.io/luxon/docs/manual/tour.html#transforming-your-datetime
https://moment.github.io/luxon/docs/manual/math.html
出力
dt.toISODate(); //=> '2017-04-20' dt.valueOf(); //=> 1494774000000 dt.toJSDate(); //=> Native Date Object dt.toLocaleString(DateTime.DATETIME_FULL); //=> 'April 20, 2017, 11:32 AM EDT'
https://moment.github.io/luxon/docs/manual/formatting.html
日本語にする
import { DateTime, Settings } from 'luxon'; DateTime.fromMillis(1494774000000, { locale: 'ja' }).toLocaleString(DateTime.DATETIME_HUGE); // -> 2017年5月15日月曜日 0:00 日本標準時 // デフォルトを変更 Settings.defaultLocale = 'ja';
https://moment.github.io/luxon/docs/manual/intl.html
タイムゾーンの変更
import { DateTime, Settings } from 'luxon'; const tz = 'America/Los_Angeles'; DateTime.fromMillis(1494774000000, { locale: 'ja', zone: tz }).toLocaleString(DateTime.DATETIME_HUGE); // -> 2017年5月14日日曜日 8:00 アメリカ太平洋夏時間 // デフォルトを変更 Settings.defaultZoneName = tz; // 作成後の変更 const dt = DateTime.local(); const rezoned = local.setZone('America/Los_Angeles'); // ローカルタイムゾーン、デフォルトタイムゾーンに戻す // https://github.com/moment/luxon/blob/f70e17c5134f221b2534b8fb035374a50e220398/src/impl/util.js#L183 const rezonedDefault = rezoned.setZone(); const rezonedLocal = rezoned.setZone('local');
Settings.defaultZoneName
を利用してデフォルトのタイムゾーンを変更してもDateTime.local
で作成したDateTimeオブジェクトにしか影響がないfromObject
,fromMillis
などを利用する場合は個別で設定する必要がある
https://moment.github.io/luxon/docs/manual/zones.html
今後の懸念
- Intl APIのポリフィルがちょっと不安。
デモ
https://stackblitz.com/edit/angular-date-pipe-and-luxon
- AngularのPipeと比較したデモ
- サマータイム(DST)の確認も
Refs
- https://angular.io/api/common/DatePipe
- https://angular.io/guide/i18n#setting-up-the-locale-of-your-app