date-fnsとは
ブラウザとNode.jsでJavaScriptの日付を操作するためJavaScriptライブラリ。
インストールは以下のコマンドを実行する。
npm install date-fns --save # or yarn add date-fns
例えばJavaScriptだけで日付処理をする場合、yyyy年M月d日のように表示したい場合は以下のように記述するが…
const now = new Date()
const [year, month, date] = [now.getFullYear(), now.getMonth() + 1, now.getDate()]
const currentDate = `${year}年${month}月${date}日`
console.log(currentDate)
// => 2022年6月3日
※ ちなみにES5(古いJavaScriptの書き方)だとコードはもっと長くなる。😅
date-fnsを使用すれば以下のように短く書くことができる。
import { format } from 'date-fns'
console.log(format(new Date(), 'yyyy年M月d日'))
// => 2022年6月3日
I18N(国際化)に対応
date-fnsはI18N(国際化)に対応しているため、日本語の曜日の表示もできる。
やり方はdate-fns/localeからjaをインポートしてlocaleのオプションで指定するだけ。
import { format } from 'date-fns'
import { ja } from 'date-fns/locale'
const currentDate = format(new Date(), 'yyyy年M月d日(E)', { locale: ja })
console.log(currentDate)
// => 2022年6月3日(金)
JavaScriptライブラリを使用すると曜日を'日月火水木金土'のように用意する必要がなくなるので便利。
ビルド後のJavaScriptファイルは日本語が含まれても約26KBと軽量です。
Moment.jsやDay.jsは使用しないほうが良い
Moment.jsもJavaScriptライブラリとして有名だが新規機能開発が停止しているため、現在使用するのは非推奨となっている。
代わりにDay.jsを推す声もあるが、Day.jsは開発頻度がdate-fnsより低いのでバグがあっても修正対応されるまで時間がかかる可能性がある。
また、date-fnsはTypeScriptをメインに開発されているが、Day.jsはJavaScriptで開発されているため、開発効率が悪くバグを内包してしまう可能性がdate-fnsより高い。
特に理由がなければJavaScriptの日付ライブラリはdate-fnsを使ったほうが良いだろう。
date-fns - modern JavaScript date utility library
