【JavaScript】JavaScriptで1桁の月や日をゼロ埋め！padStartとsliceの使い方

はじめに

JavaScriptで日付を表示する際に、1桁の月や日を2桁（"01", "02" など）で表示したい場合 があります。

例えば、new Date().getMonth() + 1をそのまま表示すると、1月が1になってしまいますが、これを01のように表示する方法を調べました。

この記事は個人的なアウトプットを目的として作成したものです。そのため、誤った情報や不足している内容が含まれている可能性があります。もし間違いや気になる点がございましたら、ぜひご指摘いただけますと幸いです。

padStartを使うパターン

padStartは文字列の長さを指定し、不足分を特定の文字で埋めることができます。

• 第一引数 (targetLength) … 目標とする文字数
• 第二引数 (padString) … 不足分を埋める文字

const today = new Date();
const month = today.getMonth() + 1;
const newmonth = month.toString().padStart(2, "0");
console.log(newmonth); //出力結果　02

ポイント

• toString()で数値を文字列に変換する必要がある
• "0"を埋めることで、1 → "01"のように変換できる

sliceを使うパターン

sliceを使う方法では、先頭に"0"をつけた後、後ろ2桁を取得 することでゼロ埋めを実現します。

const today = new Date();
const month = ("0" + (today.getMonth() + 1)).slice(-2);
console.log(month); //出力結果　02

ポイント

• ("0" + 数値)で先頭に"0"を追加
• slice(-2)で後ろ2文字を取得（例: "012" → "12", "09" → "09"）

終わりに

どちらの方法でも 1桁の月を"01"のように2桁表示できます。
場面に応じて使い分けてみてください！

参考

『JavaScriptでゼロパディングする』Zenn

『JavaScriptで0パディングを行う方法』Qiita