date-fnsについて

はじめに

最近は date-fns を使うことが多いので、メモとして書いておきます。

format

Dateオブジェクトを指定した文字列にして生成できる。
https://date-fns.org/v2.14.0/docs/format

const date = new Date()  // Fri May 13 2022 17:09:15 GMT+0900 (日本標準時) 
format(date, 'yyyy-MM-dd') // 2022-05-13
format(date, 'yyyy/MM/dd HH:mm:ss') // 2022/05/13 17:09:15
format(date, 'yyyy年M月d日(E)', {locale: ja}) // 2022年5月13日(金)

parse

文字列をDateオブジェクトに変換する。
https://date-fns.org/v2.14.0/docs/parse

parse('2022-05-13', 'yyyy-MM-dd', new Date()) // Fri May 13 2022 00:00:00 GMT+0900 (日本標準時)
parse('2022-05-13 09:15:10', 'yyyy-MM-dd HH:mm:ss', new Date()) // Fri May 13 2022 09:15:10 GMT+0900 (日本標準時)

addDays, subDays

特定の日付に日付を加算、減算できる。

addDays(new Date(2022, 4, 13), 1) // Sat May 14 2022 00:00:00 GMT+0900 (日本標準時)
subDays(new Date(2022, 4, 13), 1)  // Thu May 12 2022 00:00:00 GMT+0900 (日本標準時)

週、月、年を加算するときは、addWeeks、addMonths、addYears を使う。
逆に週、月、年を減算するときは、subWeeks、subMonths、subYears を使う。

differenceInCalendarDays

指定した日付の差を求めることができる。

differenceInCalendarDays(new Date(2022, 4, 13, 0, 0), new Date(2021, 4, 13, 0, 0)) // 365
differenceInCalendarDays(new Date(2022, 4, 13, 0, 0), new Date(2022, 4, 12, 23, 59)) // 1
differenceInCalendarDays(new Date(2021, 4, 13, 0, 0), new Date(2022, 4, 13, 0, 0)) // -365

eachDayOfInterval

指定期間内の各日付を配列にしてくれる。

eachDayOfInterval({ start: new Date(2022, 4, 13), end: new Date(2022, 4, 16)})
// [Fri May 13 2022 00:00:00 GMT+0900 (日本標準時), Sat May 14 2022 00:00:00 GMT+0900 (日本標準時), Sun May 15 2022 00:00:00 GMT+0900 (日本標準時), Mon May 16 2022 00:00:00 GMT+0900 (日本標準時)]

eachWeekendOfInterval

指定期間内の土日のみを配列にしてくれる。

eachWeekendOfInterval({ start: new Date(2022, 4, 1), end: new Date(2022, 4, 31)})
// [Sun May 01 2022 00:00:00 GMT+0900 (日本標準時), Sat May 07 2022 00:00:00 GMT+0900 (日本標準時), Sun May 08 2022 00:00:00 GMT+0900 (日本標準時), Sat May 14 2022 00:00:00 GMT+0900 (日本標準時), Sun May 15 2022 00:00:00 GMT+0900 (日本標準時), Sat May 21 2022 00:00:00 GMT+0900 (日本標準時), Sun May 22 2022 00:00:00 GMT+0900 (日本標準時), Sat May 28 2022 00:00:00 GMT+0900 (日本標準時), Sun May 29 2022 00:00:00 GMT+0900 (日本標準時)]

参考

https://date-fns.org/
https://tech.mof-mof.co.jp/blog/date-fns/