ピュアなJavaScriptで日時の操作をするのつらすぎると思っていたのですが、ECMAScript proposalsのTemporalという日時を扱うためのAPIがあるようで、ちょっと触ってみたのでメモしておきます📝
公式のドキュメントはこちら👇
Temporalを使ってみる
⚠Temporalはproposalなので、今回書いた内容が最新の内容と違う可能性があるので使うときは最新の公式ドキュメントを参照したほうが良いと思います🙇♂️
準備
Temporalはnpmで公開されていているので簡単に試すことができます📦
$ npm install --save proposal-temporal
install後にimportしてあげれば🙆♂️
// Temporalをimport import pkg from 'proposal-temporal'; const { Temporal } = pkg;
日時を表すオブジェクトを生成する
Temporal.DateTimeのオブジェクトを生成することで、その後色々な日時まわりの処理を行うことが出来るようです🕛
Temporal.now.dateTime()を使うと現在日時のオブジェクトが取得できて、Temporal.DateTime.fromに年月日...を表す数値、または ISO 8601形式の文字列を渡すことで任意の日時のオブジェクトを取得出来るみたいですね👀
// 現在時刻を取得 const now = Temporal.now.dateTime() console.log("now", now.toString()) // 任意の日時でオブジェクトを生成 const temporalObj = new Temporal.DateTime(2000,1,1) console.log('temporalObj', temporalObj.toString()) const temporalObjFrom = Temporal.DateTime.from('2020-01-01T12:30') console.log('temporalObjFrom', temporalObjFrom.toString())
結果
now 2020-07-11T18:22:58.651378622 temporalObj 2000-01-01T00:00 temporalObjFrom 2020-01-01T12:30
期間を指定して日時の加減算を行う
N日後やN日前といった期間を指定した日付の加減算もTemporal.dateTimeのminusとplusを使うことによってできるようです✨(これが欲しかった・・・！)
const now = Temporal.now.dateTime() console.log("now", now.toString()) console.log("1 seccond ago", now.minus({seconds: 1}).toString()) console.log("1 seccond since", now.plus({seconds: 1}).toString()) console.log("1 minute ago", now.minus({minutes: 1}).toString()) console.log("1 minute since", now.plus({minutes: 1}).toString()) console.log("1 hour ago", now.minus({hours: 1}).toString()) console.log("1 hour since", now.plus({hours: 1}).toString()) console.log("yestorday", now.minus({days: 1}).toString()) console.log("tomorrow", now.plus({days: 1}).toString()) console.log("1 week ago", now.minus({weeks: 1}).toString()) console.log("1 week since", now.plus({weeks: 1}).toString()) console.log("1 month ago", now.minus({months: 1}).toString()) console.log("1 month since", now.plus({months: 1}).toString()) console.log("1 year ago", now.minus({years: 1}).toString()) console.log("1 year since", now.plus({years: 1}).toString())
結果
now 2020-07-11T18:22:58.651378622 1 seccond ago 2020-07-11T18:22:57.651378622 1 seccond since 2020-07-11T18:22:59.651378622 1 minute ago 2020-07-11T18:21:58.651378622 1 minute since 2020-07-11T18:23:58.651378622 1 hour ago 2020-07-11T17:22:58.651378622 1 hour since 2020-07-11T19:22:58.651378622 yestorday 2020-07-10T18:22:58.651378622 tomorrow 2020-07-12T18:22:58.651378622 1 week ago 2020-07-04T18:22:58.651378622 1 week since 2020-07-18T18:22:58.651378622 1 month ago 2020-06-11T18:22:58.651378622 1 month since 2020-08-11T18:22:58.651378622 1 year ago 2019-07-11T18:22:58.651378622 1 year since 2021-07-11T18:22:58.651378622
期間オブジェクトを使って日時の加減算を行う
加減算は期間を表すTemporal.Durationのオブジェクトをminus、plusの引数に渡してあげても可能なようです✨
const now = Temporal.now.dateTime() console.log("now", now.toString()) const aDay = new Temporal.Duration(0, 0, 0, 1) console.log("aDaySince", now.plus(aDay).toString()) console.log("aDayAgo", now.minus(aDay).toString())
aDaySince 2020-07-12T18:22:58.651378622 aDayAgo 2020-07-10T18:22:58.651378622
日付のフォーマットを指定
IntlをimportしてTemporal.dateTimeのtoLocaleStringの引数にフォーマットを指定するオブジェクトを渡してあげることで簡単なフォーマットの変換も行えるみたいですね📅
フォーマットを指定するオブジェクトはこちらを参照してください。
https://tc39.es/ecma402/#datetimeformat-objects
const { Intl } = pkg; const now = Temporal.now.dateTime() // MM/ddの形式に変換 console.log("formated now", now.toLocaleString(undefined, { month: "2-digit",day: "2-digit" }))
結果
formated now 07/11
おわりに
普段の開発ではmoment.js等を使用してしまうことが多かったのですが、このような処理が標準導入されると、めちゃめちゃありがたいですね😭✨
安定してきたらmoment.jsではなくTemporalを使うようにしとくと移行も楽なのかなと少し思いました。
その他のproposalも下記にまとまっているようなので見てみると面白そうですね👀
