令和X年X月X日とDate型の変換【備忘録】

概要

今回、日付を令和X年X月X日XX:XXと変換する必要があり、またそこから逆に戻す必要もあり、、、
という点が少し大変で覚えられる気がしないので、メモとして残します！！

令和X年X月X日XX:XXは長いので、本記事では令和フォーマットと呼ぶことにしています。

実装

実装としては、JS標準のDate型のtoLocalDateString(locales, option)を利用しています。
日本語にしたいので、localesはja-JP-u-ca-japaneseを指定しています。
また、さまざまなオプションを利用した指定になるので、詳細はMDNで確認してもらえると幸いです。

Date→令和フォーマット

DateToFormat

new Date().toLocaleDateString('ja-JP-u-ca-japanese', {
    hour12: false,
    year: 'numeric',
    month: 'narrow',
    day: 'numeric',
    weekday: 'narrow',
    hour: '2-digit',
    minute: '2-digit',
})

令和フォーマット→日付

dateToNumber

const HEISEI_TO_REIWA_YEAR = 2018

const dateToNumber = (format: string) => {
    const date = format
      .match('^令和[0-9]*年[0-9]*月[0-9]*日')![0]
      .replace('令和', '')
      .replace('年', '/')
      .replace('月', '/')
      .replace('日', '')
      .split('/')
      .map((str) => parseInt(str, 10))
    const time = format
      .match('[0-9]*:[0-9]*')![0]
      .split(':')
      .map((str) => parseInt(str, 10))
    const newDate = new Date(
      date[0] + HEISEI_TO_REIWA_YEAR,
      date[1],
      date[2],
      time[0],
      time[1]
    )
    return newDate
}

令和X年を西暦にするには、令和X年＋年号が変わる前の2018年で求められます。
(令和)5 ＋ (西暦)2018 = 2023
ちょうど2023年になる。

正規表現を賢く使った方法

コメントの方で @ss8826さんが参考になる方法で実装されていたので
取り上げさせていただきます🙇‍♂️

const reiwaStrToDate = str => {
  const p = str.match(/\d+/g);
  p[0] -= -2018;
  p[1] --;
  return new Date(...p);
};

console.log(reiwaStrToDate('令和5年2月')); // Wed Feb 01 2023 00:00:00 GMT+0900 (日本標準時)
console.log(reiwaStrToDate('令和5年2月4日')); // Sat Feb 04 2023 00:00:00 GMT+0900 (日本標準時)
console.log(reiwaStrToDate('令和5年2月4日12時')); // Sat Feb 04 2023 12:00:00 GMT+0900 (日本標準時)
console.log(reiwaStrToDate('令和5年2月4日12:34')); // Sat Feb 04 2023 12:34:00 GMT+0900 (日本標準時)
console.log(reiwaStrToDate('令和5年2月4日12:34:56')); // Sat Feb 04 2023 12:34:56 GMT+0900 (日本標準時)

ポイントは、以下の3点と思われます。

1. /d+で数字のみを抽出
   1. 数字dを1つ以上+抽出する
2. gオプションで複数回抽出
   1. 置換したい文字列を指定し、複数含まれている場合に、全てを置換するオプション
   2. matchは標準では1度しか変換しません。そのため、gオプションが必要になります
3. 月に該当する部分は-1
   1. Date型ではMonthは0~11で扱われるため

gオプションに関しては、以下の記事が参考になります！

@ss8826さん、とても参考になりました！！
ありがとうございます✨