Intl.DateTimeFormat

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

コンストラクター

Intl.DateTimeFormat()
新しい DateTimeFormat オブジェクトを生成します。

静的メソッド

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

インスタンスメソッド

Intl.DateTimeFormat.prototype.format()
ロケールおよびこの DateTimeFormat オブジェクトの書式化オプションに則って日付を書式化するゲッター関数です。
Intl.DateTimeFormat.prototype.formatToParts()
オブジェクトの Array を返し、これは専用のロケールを意識した書式で使用することができる部品内の数値文字列を表します。
Intl.DateTimeFormat.prototype.resolvedOptions()
ローケルを反映しているプロパティとオブジェクトの初期化中に計算された照合オプションをもった新しいオブジェクトを返します。
Intl.DateTimeFormat.prototype.formatRange()
このメソッドは2つの Date を受け取り、 DateTimeFormat インスタンスを生成する際に指定されたロケールとオプションに基づいて、最も簡潔な方法で日付の範囲を書式化します。
Intl.DateTimeFormat.prototype.formatRangeToParts()
このメソッドは2つの Date を受け取り、書式化された日付の範囲の各部分を表すロケール固有のトークンを含むオブジェクトの配列を返します。

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, 200));

// 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 you want to be very precise
options.fractionalSecondDigits = 3;
console.log(new Intl.DateTimeFormat('en-AU', options).format(date));
// → "2:00:00.200 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"

// sometimes it's helpful to include the period of the day
options = {hour: "numeric", dayPeriod: "short"};
console.log(new Intl.DateTimeFormat('en-US', options).format(date));
// → 10 at night 

The used calendar and numbering formats can also be set independently via options arguments:

var options = {calendar: 'chinese', numberingSystem: 'arab'};
var dateFormat = new Intl.DateTimeFormat('default', options);
var usedOptions = dateFormat.resolvedOptions();

console.log(usedOptions.calendar);
// → "chinese"

console.log(usedOptions.numberingSystem);
// → "arab"

console.log(usedOptions.timeZone);
// → "America/New_York" (the users default timezone)

仕様書

仕様書
ECMAScript Internationalization API (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 完全対応 25Firefox Android 完全対応 56Opera Android 完全対応 14Safari iOS 完全対応 10Samsung Internet Android 完全対応 1.5nodejs 完全対応 0.12
補足
完全対応 0.12
補足
補足 Before version 13.0.0, only the locale data for en-US is available by default. See the DateTimeFormat() constructor for more details.
DateTimeFormat() constructorChrome 完全対応 24Edge 完全対応 12Firefox 完全対応 29IE 完全対応 11Opera 完全対応 15Safari 完全対応 10WebView Android 完全対応 4.4Chrome Android 完全対応 25Firefox Android 完全対応 56Opera Android 完全対応 14Safari iOS 完全対応 10Samsung Internet Android 完全対応 1.5nodejs 完全対応 13.0.0
完全対応 13.0.0
部分対応 0.12
補足
補足 Before version 13.0.0, only the locale data for en-US is available by default. When other locales are specified, the DateTimeFormat instance silently falls back to en-US. To make full ICU (locale) data available for versions prior to 13, see Node.js documentation on the --with-intl option and how to provide the data.
formatChrome 完全対応 24Edge 完全対応 12Firefox 完全対応 29IE 完全対応 11Opera 完全対応 15Safari 完全対応 10WebView Android 完全対応 4.4Chrome Android 完全対応 25Firefox Android 完全対応 56Opera Android 完全対応 14Safari iOS 完全対応 10Samsung Internet Android 完全対応 1.5nodejs 完全対応 0.12
補足
完全対応 0.12
補足
補足 Before version 13.0.0, only the locale data for en-US is available by default. See the DateTimeFormat() constructor for more details.
formatRangeChrome 完全対応 76Edge 未対応 なしFirefox 未対応 なしIE 未対応 なしOpera 未対応 なしSafari 未対応 なしWebView Android 完全対応 76Chrome Android 完全対応 76Firefox Android 未対応 なしOpera Android 完全対応 54Safari iOS 未対応 なしSamsung Internet Android 未対応 なしnodejs 完全対応 12.9.0
補足
完全対応 12.9.0
補足
補足 Before version 13.0.0, only the locale data for en-US is available by default. See the DateTimeFormat() constructor for more details.
formatRangeToPartsChrome 完全対応 76Edge 未対応 なしFirefox 未対応 なしIE 未対応 なしOpera 未対応 なしSafari 未対応 なしWebView Android 完全対応 76Chrome Android 完全対応 76Firefox Android 未対応 なしOpera Android 完全対応 54Safari iOS 未対応 なしSamsung Internet Android 未対応 なしnodejs 完全対応 12.9.0
補足
完全対応 12.9.0
補足
補足 Before version 13.0.0, only the locale data for en-US is available by default. See the DateTimeFormat() constructor for more details.
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 完全対応 44
補足
完全対応 44
補足
補足 Before version 58, formatToParts() returned an object with an incorrectly cased type key of dayperiod. Version 58 and later use the specification defined dayPeriod. See Chromium bug 865351.
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 完全対応 43
補足
完全対応 43
補足
補足 Before version 50, formatToParts() returned an object with an incorrectly cased type key of dayperiod. Version 50 and later use the specification defined dayPeriod. See Chromium bug 865351.
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 完全対応 8.0.0
補足
完全対応 8.0.0
補足
補足 Before version 12.0.0, formatToParts() returned an object with an incorrectly cased type key of dayperiod. Version 12.0.0 and later use the specification defined dayPeriod. See Chromium bug 865351.
補足 Before version 13.0.0, only the locale data for en-US is available by default. See the DateTimeFormat() constructor for more details.
resolvedOptionsChrome 完全対応 24Edge 完全対応 12Firefox 完全対応 29IE 完全対応 11Opera 完全対応 15Safari 完全対応 10WebView Android 完全対応 4.4Chrome Android 完全対応 25Firefox Android 完全対応 56Opera Android 完全対応 14Safari iOS 完全対応 10Samsung Internet Android 完全対応 1.5nodejs 完全対応 0.12
補足
完全対応 0.12
補足
補足 Before version 13.0.0, only the locale data for en-US is available by default. See the DateTimeFormat() constructor for more details.
supportedLocalesOfChrome 完全対応 24Edge 完全対応 12Firefox 完全対応 29IE 完全対応 11Opera 完全対応 15Safari 完全対応 10WebView Android 完全対応 4.4Chrome Android 完全対応 25Firefox Android 完全対応 56Opera Android 完全対応 14Safari iOS 完全対応 10Samsung Internet Android 完全対応 1.5nodejs 完全対応 13.0.0
完全対応 13.0.0
部分対応 0.12
補足
補足 Before version 13.0.0, only the locale data for en-US is available by default. To make full ICU (locale) data available for versions prior to 13, see Node.js documentation on the --with-intl option and how to provide the data.

凡例

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

関連情報