JavaScriptで月末/来週/先週/次の○曜日など特殊な日時をdate-fnsで取得する方法

来週とか月末とか、今を基準とした日時を出力したいってことがありました。
ちょっと特殊な日時でも、data-fnsを使用すれば簡単に取得できます。

日付取得のさまざまなパターンを記事にまとめました。
多いので、目次を活用してください。

最初にインストール
その1. 期間の末日シリーズ
その2. 期間の初日シリーズ
その3. 先○/来○シリーズ
その4. ○曜日シリーズ
1. 前の○曜日：previousXXX
2. 次の○曜日：nextXXX

最初にインストール

npm i date-fns

yarn add date-fns

前準備です。npmかyarnか、どちらかでインストールしてください。

その1. 期間の末日シリーズ

週末：endOfWeek

import { endOfWeek } from "date-fns";
// 例えば、今日が2022/06/09だったら
const result = endOfWeek(new Date());
//=> Sat Jun 11 2022 23:59:59 GMT+0900 (Japan Standard Time)

endOfWeekは、その週の土曜日(Sat)の日付が変わるギリギリを返します。
仕事は月曜からですが、週末は土曜です。

月末：endOfMonth

import { endOfMonth } from "date-fns";
// 例えば、今日が2022/06/09だったら
const result = endOfMonth(new Date());
//=> Thu Jun 30 2022 23:59:59 GMT+0900 (Japan Standard Time)

endOfMonthは、その月の最後の日付を返します。２月なら2/28、3月なら3/31ですね。
new Date()の引数を指定せずに取得できるので、簡単です。

年末：endOfYear

import { endOfYear } from "date-fns";
// 例えば、今日が2022/06/09だったら
const result = endOfYear(new Date());
//=> Sat Dec 31 2022 23:59:59 GMT+0900 (Japan Standard Time)

endOfYearは、その年の最後の日付、年明け前ギリギリを返します。

その2. 期間の初日シリーズ

週初：startOfWeek

import { startOfWeek } from "date-fns";
// 例えば、今日が2022/06/09だったら
const result = startOfWeek(new Date());
//=> Sun Jun 05 2022 00:00:00 GMT+0900 (Japan Standard Time)

startOfWeekは、その週の日曜日(San)の0時を返します。
日曜はお休みの方が多いと思いますが、週の初めです。

月初：startOfMonth

import { startOfMonth } from "date-fns";
// 例えば、今日が2022/06/09だったら
const result = startOfMonth(new Date());
//=> Wed Jun 01 2022 00:00:00 GMT+0900 (Japan Standard Time)

startOfMonthは、その月の最初の日付を返します。

年初：startOfYear

import { startOfYear } from "date-fns";
// 例えば、今日が2022/06/09だったら
const result = startOfYear(new Date());
//=> Sat Jan 01 2022 00:00:00 GMT+0900 (Japan Standard Time)

startOfYearは、その年の最初の日付を返します。

その3. 先○/来○シリーズ

先週/来週：subWeeks/addWeeks

import { addWeeks, subWeeks } from "date-fns";
// 例えば、今日が2022/06/09だったら
const lastWeek = subWeeks(new Date(), 1);
//=> Thu Jun 02 2022 22:49:54 GMT+0900 (Japan Standard Time)
const nextWeek = addWeeks(new Date(), 1);
//=> Thu Jun 16 2022 22:46:50 GMT+0900 (Japan Standard Time)
//時刻は実行時間になる

subWeeks：指定日付から指定週数を引いた日時を返す
addWeeks：指定日付から指定週数を足した日時を返す

第二引数に1を指定すると1週間、2を指定すると２週間を減算/加算します。

先月/来月：subMonths/addMonths

import { addMonths, subMonths } from "date-fns";
// 例えば、今日が2022/06/09だったら
const lastMonth = subMonths(new Date(), 1);
//=> Mon May 09 2022 22:59:39 GMT+0900 (Japan Standard Time)
const nextMonth = addMonths(new Date(), 1);
//=> Sat Jul 09 2022 22:59:10 GMT+0900 (Japan Standard Time)
//時刻は実行時間になる

subMonths：指定日付から指定月数を引いた日時を返す
addMonths：指定日付から指定月数を足した日時を返す

第二引数に1を指定すると1ヶ月、2を指定すると２ヶ月を減算/加算します。

去年/来年：subYears/addYears

import { addYears, subYears } from "date-fns";
// 例えば、今日が2022/06/09だったら
const lastMonth = subYears(new Date(), 1);
//=> Mon May 09 2022 22:59:39 GMT+0900 (Japan Standard Time)
const nextMonth = addYears(new Date(), 1);
//=> Fri Jun 09 2023 23:02:45 GMT+0900 (Japan Standard Time)
//時刻は実行時間になる

subYears：指定日付から指定年数を引いた日時を返す
addYears：指定日付から指定年数を足した日時を返す

第二引数に1を指定すると1年、2を指定すると２年を減算/加算します。

その4. ○曜日シリーズ

前の○曜日：previousXXX

指定日付から前の曜日を取得するには、下記のメソッドを使います。

前の日曜日：previousSunday
前の月曜日：previousMonday
前の火曜日：previousTuesday
前の水曜日：previousWednesday
前の木曜日：previousThursday
前の金曜日：previousFriday
前の土曜日：previousSaturday

指定日と同じ曜日のメソッドの場合、１週間前の日時が返ってきます。

import { previousThursday } from "date-fns";
// 例えば、今日が2022/06/09(Thu)だったら
const result = previousThursday(new Date());
//=> Thu Jun 02 2022 23:15:12 GMT+0900 (Japan Standard Time)
//時刻は実行時間になる

次の○曜日：nextXXX

指定日付から前の曜日を取得するには、下記のメソッドを使います。

次の日曜日：nextSunday
次の月曜日：nextMonday
次の火曜日：nextTuesday
次の水曜日：nextWednesday
次の木曜日：nextThursday
次の金曜日：nextFriday
次の土曜日：nextSaturday

指定日と同じ曜日のメソッドの場合、１週間後の日時が返ってきます。

import { nextThursday } from "date-fns";
// 例えば、今日が2022/06/09(Thu)だったら
const result = nextThursday(new Date());
//=> Thu Jun 16 2022 23:19:56 GMT+0900 (Japan Standard Time)
//時刻は実行時間になる

リンク