Intl.DateTimeFormat

Intl.DateTimeFormat オブジェクトは、言語に応じた日付と時刻の書式化を可能にするオブジェクトのためのコンストラクターです。

構文

new Intl.DateTimeFormat([locales[, options]])
Intl.DateTimeFormat.call(this[, locales[, options]])

引数

locales Optional

BCP47 言語タグの文字列、または、そのような文字列の配列です。ブラウザーの既定のロケールを使用するには、この引数を省略するか、 undefined を渡すかしてください。 Unicode 拡張に対応しています (例えば "en-US-u-ca-buddhist" など)。 locales 引数の一般的な形式と解釈は、 Intl のページをご覧ください。次の Unicode 拡張キーが利用できます。

nu
番号方式。使用できる値は次のとおりです。 "arab", "arabext", "bali", "beng", "deva", "fullwide", "gujr", "guru", "hanidec", "khmr", "knda", "laoo", "latn", "limb", "mlym", "mong", "mymr", "orya", "tamldec", "telu", "thai", "tibt"
ca
カレンダー。使用できる値は次のとおりです。 "buddhist", "chinese", "coptic", "ethiopia", "ethiopic", "gregory", "hebrew", "indian", "islamic", "iso8601", "japanese", "persian", "roc"
hc
時制。使用できる値は次の通りです。 "h11", "h12", "h23", "h24".
options Optional

以下のプロパティの一部またはすべてを持つオブジェクトです。

dateStyle
format() が呼び出された際に使用される日付の書式化スタイルです。利用可能な値は以下のとおりです。
  • "full"
  • "long"
  • "medium"
  • "short"
timeStyle
format() が呼び出された際に使用される時刻の書式化スタイルです。利用可能な値は以下のとおりです。
  • "full"
  • "long"
  • "medium"
  • "short"
localeMatcher
使用するロケールマッチングアルゴリズム。利用可能な値は "lookup" と "best fit" です。デフォルトは "best fit" です。このオプションについての詳細は、Intl page をご覧ください。
timeZone
使用するタイムゾーン。実装が認識しなければならない唯一の値は "UTC" です。既定値は、実行時の既定のタイムゾーンです。実装は、 IANA タイムゾーンデータベースのタイムゾーン名、例えば "Asia/Shanghai", "Asia/Kolkata", "America/New_York" なども認識できる場合があります。
hour12
12時制を使用するかどうか (24時制に対して)。可能な値は truefalse です。既定ではロケールに依存します。このオプションは hc 言語タグや hourCycle オプションと一緒に使用された場合、これらを上書きします。
hourCycle
使用する時の周期です。利用可能な値は "h11", "h12", "h23", "h24" です。このオプションは hc 言語タグと一緒に使用された場合はそれを上書きし、両方のオプションが指定されていた場合は hour12 オプションが優先されます。
formatMatcher
使用するフォーマットマッチングアルゴリズム。可能な値は "basic" と "best fit" です。既定値は "best fit" です。このプロパティの使用方法については、以下の項を参照してください。

以下のプロパティは、書式化の出力や、要求された表現で使用する日付や時刻のコンポーネントです。実装は、少なくとも以下のサブセットに対応することが要求されています。

  • weekday, year, month, day, hour, minute, second
  • weekday, year, month, day
  • year, month, day
  • year, month
  • month, day
  • hour, minute, second
  • hour, minute

実装は他のサブセットに対応することもでき、要求はすべての利用可能な表現の中から最適なものを見つけるために交渉します。 formatMatcher プロパティによるこの交渉や選択には2つのアルゴリズムが利用できます。完全に定義された "basic" アルゴリズムと、実装に依存した"best fit" アルゴリズムです。

weekday
曜日の表現です。利用可能な値は以下の通りです。
  • "long" (例 Thursday)
  • "short" (例 Thu)
  • "narrow" (例 T)。ロケールによっては、 narrow 形式が同じ曜日が2つある場合もあります (例 Tuesday の narrow 形式も T です)。
era
時代の表現です。利用可能な値は以下の通りです。
  • "long" (例 Anno Domini, 紀元)
  • "short" (例 AD)
  • "narrow" (例 A)
year
年の表現です。利用可能な値は以下の通りです。
  • "numeric" (例 2012)
  • "2-digit" (例 12)
month
月の表現です。利用可能な値は以下の通りです。
  • "numeric" (例 2)
  • "2-digit" (例 02)
  • "long" (例 March)
  • "short" (例 Mar)
  • "narrow" (例 M)。ロケールによっては、 narrow 形式が同じ月が2つある場合もあります (例 May の narrow 形式も M です)。
day
日の表現です。利用可能な値は以下の通りです。
  • "numeric" (例 1)
  • "2-digit" (例 01)
hour
時の表現です。利用可能な値は "numeric", "2-digit" です。
minute
分の表現です。利用可能な値は "numeric", "2-digit" です。
second
秒の表現です。利用可能な値は "numeric", "2-digit" です。
timeZoneName
タイムゾーン名の表現です。利用可能な値は以下の通りです。
  • "long" (例 British Summer Time)
  • "short" (例 GMT+1)

日付・時間コンポーネントプロパティの既定値は undefined ですが、すべてのコンポーネントプロパティが undefined であった場合、 year, month, day は "numeric" であると仮定されます。

解説

プロパティ

Intl.DateTimeFormat.prototype
すべてのオブジェクトにプロパティを追加することができます。

メソッド

Intl.DateTimeFormat.supportedLocalesOf()
指定されたロケールのうち、実行時の既定のロケールにフォールバックされずに対応されるものを含む配列を返します。

DateTimeFormat インスタンス

プロパティ

DateTimeFormat のインスタンスは、プロトタイプから以下ののプロパティを継承します。

Intl.DateTimeFormat.prototype.constructor
Intl.DateTimeFormat への参照です。

メソッド

DateTimeFormat のインスタンスは、プロトタイプから次のメソッドを継承します。

Intl.DateTimeFormat.prototype.format()
ロケールおよびこの DateTimeFormat オブジェクトの書式化オプションに則って日付を書式化するゲッター関数です。
Intl.DateTimeFormat.prototype.formatToParts()
Returns an Array of objects representing the date string in parts that can be used for custom locale-aware formatting.
Intl.DateTimeFormat.prototype.resolvedOptions()
ローケルを反映しているプロパティとオブジェクトの初期化中に計算されたオプションをもった新しいオブジェクトを返します。
Intl.DateTimeFormat.prototype.formatRange()
This method receives two Dates and formats the date range in the most concise way based on the locale and options provided when instantiating DateTimeFormat.
Intl.DateTimeFormat.prototype.formatRangeToParts()
This method receives two Dates and returns an Array of objects containing the locale-specific tokens representing each part of the formatted date range.

DateTimeFormat の使用

基本的に、ロケールを指定せずに使用すると、 DateTimeFormat は既定のロケールとオプションを使用します。

var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));

// toLocaleString without arguments depends on the implementation,
// the default locale, and the default time zone
console.log(new Intl.DateTimeFormat().format(date));
// → "12/19/2012" if run with en-US locale (language) and time zone America/Los_Angeles (UTC-0800)

locales の使用

この例では、ローカライズされた日付と時刻の形式のバリエーションの一部示しています。アプリケーションのユーザーインターフェイスで使用される言語のフォーマットを取得するには、 locales 引数を使用して、その言語 (およびおそらくいくつかのフォールバック言語) を指定してください。

var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));

// Results below use the time zone of America/Los_Angeles (UTC-0800, Pacific Standard Time)

// US English uses month-day-year order
console.log(new Intl.DateTimeFormat('en-US').format(date));
// → "12/19/2012"

// British English uses day-month-year order
console.log(new Intl.DateTimeFormat('en-GB').format(date));
// → "19/12/2012"

// Korean uses year-month-day order
console.log(new Intl.DateTimeFormat('ko-KR').format(date));
// → "2012. 12. 19."

// Arabic in most Arabic speaking countries uses real Arabic digits
console.log(new Intl.DateTimeFormat('ar-EG').format(date));
// → "١٩‏/١٢‏/٢٠١٢"

// for Japanese, applications may want to use the Japanese calendar,
// where 2012 was the year 24 of the Heisei era
console.log(new Intl.DateTimeFormat('ja-JP-u-ca-japanese').format(date));
// → "24/12/19"

// when requesting a language that may not be supported, such as
// Balinese, include a fallback language, in this case Indonesian
console.log(new Intl.DateTimeFormat(['ban', 'id']).format(date));
// → "19/12/2012"

options の使用

日付と時刻の書式は options 引数を使用してカスタマイズできます。

var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));

// request a weekday along with a long date
var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
console.log(new Intl.DateTimeFormat('de-DE', options).format(date));
// → "Donnerstag, 20. Dezember 2012"

// an application may want to use UTC and make that visible
options.timeZone = 'UTC';
options.timeZoneName = 'short';
console.log(new Intl.DateTimeFormat('en-US', options).format(date));
// → "Thursday, December 20, 2012, GMT"

// sometimes you want to be more precise
options = {
  hour: 'numeric', minute: 'numeric', second: 'numeric', 
  timeZone: 'Australia/Sydney',
  timeZoneName: 'short'
};
console.log(new Intl.DateTimeFormat('en-AU', options).format(date));
// → "2:00:00 pm AEDT"

// sometimes even the US needs 24-hour time
options = {
  year: 'numeric', month: 'numeric', day: 'numeric',
  hour: 'numeric', minute: 'numeric', second: 'numeric',
  hour12: false,
  timeZone: 'America/Los_Angeles' 
};
console.log(new Intl.DateTimeFormat('en-US', options).format(date));
// → "12/19/2012, 19:00:00"

// to specify options but use the browser's default locale, use 'default'
console.log(new Intl.DateTimeFormat('default', options).format(date));
// → "12/19/2012, 19:00:00"

仕様書

仕様書 状態 備考
ECMAScript Internationalization API 4.0 (ECMA-402)
Intl.DateTimeFormat の定義
ドラフト
ECMAScript Internationalization API 2.0 (ECMA-402)
Intl.DateTimeFormat の定義
標準
ECMAScript Internationalization API 1.0 (ECMA-402)
Intl.DateTimeFormat の定義
標準 初回定義

ブラウザーの互換性

Update compatibility data on GitHub
デスクトップモバイルサーバー
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung InternetNode.js
DateTimeFormatChrome 完全対応 24Edge 完全対応 12Firefox 完全対応 29IE 完全対応 11Opera 完全対応 15Safari 完全対応 10WebView Android 完全対応 4.4Chrome Android 完全対応 26Firefox Android 完全対応 56Opera Android 完全対応 14Safari iOS 完全対応 10Samsung Internet Android 完全対応 1.5nodejs 完全対応 あり
dateStyleChrome 完全対応 76Edge 未対応 なしFirefox 未対応 なしIE 未対応 なしOpera 完全対応 63Safari ? WebView Android 完全対応 76Chrome Android 完全対応 76Firefox Android 未対応 なしOpera Android 未対応 なしSafari iOS ? Samsung Internet Android 未対応 なしnodejs 完全対応 あり
formatChrome 完全対応 24Edge 完全対応 12Firefox 完全対応 29IE 完全対応 11Opera 完全対応 15Safari 完全対応 10WebView Android 未対応 なしChrome Android 完全対応 26Firefox Android 完全対応 56Opera Android ? Safari iOS 完全対応 10Samsung Internet Android 完全対応 1.5nodejs ?
formatRangeChrome 完全対応 76Edge 未対応 なしFirefox 未対応 なしIE 未対応 なしOpera 未対応 なしSafari 未対応 なしWebView Android 完全対応 76Chrome Android 完全対応 76Firefox Android 未対応 なしOpera Android 未対応 なしSafari iOS 未対応 なしSamsung Internet Android 未対応 なしnodejs 未対応 なし
formatRangeToPartsChrome 完全対応 76Edge 未対応 なしFirefox 未対応 なしIE 未対応 なしOpera 未対応 なしSafari 未対応 なしWebView Android 完全対応 76Chrome Android 完全対応 76Firefox Android 未対応 なしOpera Android 未対応 なしSafari iOS 未対応 なしSamsung Internet Android 未対応 なしnodejs 未対応 なし
formatToPartsChrome 完全対応 57
補足
完全対応 57
補足
補足 Before version 71, formatToParts() returned an object with an incorrectly cased type key of dayperiod. Version 71 and later use the specification defined dayPeriod. See Chromium bug 865351.
Edge 完全対応 18Firefox 完全対応 51IE 未対応 なしOpera 完全対応 ありSafari 完全対応 11WebView Android 完全対応 57
補足
完全対応 57
補足
補足 Before version 71, formatToParts() returned an object with an incorrectly cased type key of dayperiod. Version 71 and later use the specification defined dayPeriod. See Chromium bug 865351.
Chrome Android 完全対応 57
補足
完全対応 57
補足
補足 Before version 71, formatToParts() returned an object with an incorrectly cased type key of dayperiod. Version 71 and later use the specification defined dayPeriod. See Chromium bug 865351.
Firefox Android 完全対応 56Opera Android 未対応 なしSafari iOS 完全対応 11Samsung Internet Android 完全対応 7.0
補足
完全対応 7.0
補足
補足 Before version 71, formatToParts() returned an object with an incorrectly cased type key of dayperiod. Version 71 and later use the specification defined dayPeriod. See Chromium bug 865351.
nodejs 完全対応 あり
hourCycleChrome 完全対応 73Edge 完全対応 18Firefox 完全対応 58IE 未対応 なしOpera 完全対応 60Safari ? WebView Android 完全対応 73Chrome Android 完全対応 73Firefox Android 完全対応 58Opera Android 完全対応 52Safari iOS ? Samsung Internet Android 未対応 なしnodejs ?
IANA time zone names in timeZone optionChrome 完全対応 24Edge 完全対応 14Firefox 完全対応 52IE 未対応 なしOpera 完全対応 15Safari 完全対応 10WebView Android 完全対応 37Chrome Android 完全対応 26Firefox Android 完全対応 56Opera Android ? Safari iOS 完全対応 10Samsung Internet Android 完全対応 1.5nodejs ?
prototypeChrome 完全対応 24Edge 完全対応 12Firefox 完全対応 29IE 完全対応 11Opera 完全対応 15Safari 完全対応 10WebView Android 未対応 なしChrome Android 完全対応 26Firefox Android 完全対応 56Opera Android ? Safari iOS 完全対応 10Samsung Internet Android 完全対応 1.5nodejs ?
resolvedOptionsChrome 完全対応 24Edge 完全対応 12Firefox 完全対応 29IE 完全対応 11Opera 完全対応 15Safari 完全対応 10WebView Android 未対応 なしChrome Android 完全対応 26Firefox Android 完全対応 56Opera Android ? Safari iOS 完全対応 10Samsung Internet Android 完全対応 1.5nodejs ?
supportedLocalesOfChrome 完全対応 24Edge 完全対応 12Firefox 完全対応 29IE 完全対応 11Opera 完全対応 15Safari 完全対応 10WebView Android 未対応 なしChrome Android 完全対応 26Firefox Android 完全対応 56Opera Android ? Safari iOS 完全対応 10Samsung Internet Android 完全対応 1.5nodejs ?
timeStyleChrome 完全対応 76Edge 未対応 なしFirefox 未対応 なしIE 未対応 なしOpera 完全対応 63Safari ? WebView Android 完全対応 76Chrome Android 完全対応 76Firefox Android 未対応 なしOpera Android 未対応 なしSafari iOS ? Samsung Internet Android 未対応 なしnodejs 完全対応 あり

凡例

完全対応  
完全対応
未対応  
未対応
実装状況不明  
実装状況不明
実装ノートを参照してください。
実装ノートを参照してください。

関連情報