Intl.DateTimeFormatを使って日付をyyyy-mm-dd形式でフォーマットする方法

2024-04-02

JavaScriptで日付をyyyy-mm-dd形式で書式設定する方法

Dateオブジェクトには、日付を文字列に変換するtoString()メソッドがあります。このメソッドの引数に書式文字列を指定することで、希望する形式で日付を取得することができます。

const date = new Date();
const formattedDate = date.toString("yyyy-MM-dd");
console.log(formattedDate); // 出力: 2024-03-17

toString()メソッドで使用できる書式文字列は以下の通りです。

y: 年（4桁）
h: 時（12時間表記）
m: 分
s: 秒
S: ミリ秒

これらの書式文字列を組み合わせて、希望する形式を指定することができます。

テンプレートリテラルを使うと、より簡単に日付をフォーマットすることができます。

const date = new Date();
const formattedDate = `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`;
console.log(formattedDate); // 出力: 2024-03-17

テンプレートリテラルの中に、変数や式を埋め込むことができます。上記の例では、dateオブジェクトのプロパティを使って、年、月、日をそれぞれ取得しています。

ライブラリを使う

moment().format("YYYY-MM-DD"); // 出力: 2024-03-17

Moment.jsは、日付処理に特化したライブラリです。様々な書式で日付をフォーマットしたり、日付の加算減算などを行うことができます。

JavaScriptで日付をyyyy-mm-dd形式で書式設定するには、いくつかの方法があります。それぞれの特徴を理解して、自分に合った方法を選びましょう。

Dateオブジェクトのメソッドを使う

const date = new Date();

// 1. toString()メソッドを使う
const formattedDate1 = date.toString("yyyy-MM-dd");
console.log(formattedDate1); // 出力: 2024-03-17

// 2. getFullYear(), getMonth(), getDate()メソッドを使う
const formattedDate2 = `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`;
console.log(formattedDate2); // 出力: 2024-03-17

テンプレートリテラルを使う

const date = new Date();

const formattedDate = `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`;
console.log(formattedDate); // 出力: 2024-03-17

ライブラリを使う

// Moment.jsを使う

moment().format("YYYY-MM-DD"); // 出力: 2024-03-17

JavaScriptで日付をyyyy-mm-dd形式で書式設定する他の方法

Intl.DateTimeFormatを使うと、ロケールに合わせた書式で日付をフォーマットすることができます。

const date = new Date();
const options = {
  year: "numeric",
  month: "numeric",
  day: "numeric",
};
const formattedDate = new Intl.DateTimeFormat("ja-JP", options).format(date);
console.log(formattedDate); // 出力: 2024年3月17日

Intl.DateTimeFormatは、ブラウザのサポート状況がまだ完全ではないため、注意が必要です。

function formatDate(date) {
  const year = date.getFullYear();
  const month = date.getMonth() + 1;
  const day = date.getDate();
  return `${year}-${month}-${day}`;
}

const formattedDate = formatDate(new Date());
console.log(formattedDate); // 出力: 2024-03-17