Intl.DateTimeFormat【国際化日時フォーマット】コンストラクタ・プロパティ・メソッド
new Intl.DateTimeFormat()【コンストラクタ】
format【フォーマット関数】
formatRange【範囲フォーマット】
formatRangeToParts【範囲フォーマットパーツ取得】
formatToParts【フォーマットパーツ取得】
resolvedOptions()【オプション取得】
supportedLocalesOf()【サポート ロケール取得】

new Intl.DateTimeFormat()【コンストラクタ】

メモ

構文

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

戻り値Intl.DateTimeFormat【国際化日時フォーマット】 オブジェクト
localesBCP 47 の言語タグの文字列 または 配列 (省略:デフォルトのロケール) 詳細は 下記 参照
optionsオプション (実装依存) 詳細は 下記 参照
BCP 47 の言語タグ (例)
説明
ja日本語
ja-JP日本語 (日本)
en-US英語 (アメリカ)
en-GB英語 (イギリス)
de-DEドイツ語 (ドイツ)
fr-FRフランス語 (フランス)
以下の Unicode 拡張 数値フォーマット をサポート (実装依存)

(-u-nu-○)
説明コード
arabアラビア・インド数字٩ ~ ٠U+0660 ~ U+0669
arabextペルシア数字۰ ~ ۹U+06F0 ~ U+06F9
baliバリ数字U+1B50 ~ U+1B59
bengベンガル数字০ ~ ৯U+09E6 ~ U+09EF
devaデーヴァナーガリー数字० ~ ९U+0966 ~ U+096F
fullwide全角数字0 ~ 9U+FF10 ~ U+FF19
gujrグジャラート数字૦ ~ ૯U+0AE6 ~ U+0AEF
guruグルムキー数字੦ ~ ੯U+0A66 ~ U+0A6F
hanidec漢数字〇 ~ 九 U+3007, U+4E00, U+4E8C, U+4E09, U+56DB,
U+4E94, U+516D, U+4E03, U+516B, U+4E5D
khmrクメール数字០ ~ ៩U+17E0 ~ U+17E9
kndaカンナダ数字೦ ~ ೯U+0CE6 ~ U+0CEF
laooラオ数字໐ ~ ໙U+0ED0 ~ U+0ED9
latn 算用数字 (アラビア数字)0 ~ 9U+0030 ~ U+0039
limbリンブ数字U+1946 ~ U+194F
mlymマラヤーラム数字൦ ~ ൯U+0D66 ~ U+0D6F
mongモンゴル数字᠐ ~ ᠙U+1810 ~ U+1819
mymrミャンマー数字၀ ~ ၉U+1040 ~ U+1049
oryaオリヤー数字뙦 ~ 뙯U+0B66 ~ U+0B6F
tamldecタミル数字௦ ~ ௯U+0BE6 ~ U+0BEF
teluテルグ数字౦ ~ ౯U+0C66 ~ U+0C6F
thaiタイ数字๐ ~ ๙U+0E50 ~ U+0E59
tibtチベット数字༠ ~ ༩U+0F20 ~ U+0F29
以下の Unicode 拡張 カレンダーフォーマット をサポート (実装依存)

(-u-ca-○)
説明
buddhistタイ仏教暦
chinese中国暦
copticコプト暦
ethioaaダンギ暦
ethiopicエチオピア暦
gregoryグレゴリオ暦 (西暦)
hebrewユダヤ暦
indianインド国定暦
islamicイスラム暦 (1)
islamiccイスラム暦 (2)
iso8601ISO 8601
japanese和暦
persianペルシア暦
roc中華民国暦
以下の Unicode 拡張 時間形式フォーマット をサポート (実装依存)

(-u-hc-○)
説明
h1112 時間形式 (0 ~ 11)
h1212 時間形式 (1 ~ 12)
h2324 時間形式 (0 ~ 23)
h2424 時間形式 (1 ~ 24)

オプション (実装依存)
オプション値 (太字:デフォルト値)説明
localeMatcher'lookup':Lookupアルゴリズム
'best fit':最適アルゴリズム
ロケールマッチングアルゴリズム
formatMatcher'basic':Basicアルゴリズム
'best fit':最適アルゴリズム
書式マッチングアルゴリズム
calendarUnicode 拡張 カレンダーフォーマット
numberingSystemUnicode 拡張 数値フォーマット
timeZoneUTC ・ 'Asia/Tokyo' ・ 'America/New_York' 等 タイムゾーン (IANA)
hourCycle 'h11':12 時間形式 (0 ~ 11)
'h12':12 時間形式 (1 ~ 12)
'h23':24 時間形式 (0 ~ 23)
'h24':24 時間形式 (1 ~ 24)
時間形式
hour12true:12 時間形式
false:24 時間形式
12/24 時間形式
weekday'narrow':縮小形式
'short':短い形式
'long':長い形式
曜日
era'narrow':縮小形式
'short':短い形式
'long':長い形式
年号
year'2-digit':2桁
'numeric':ゼロサプレス
month'2-digit':2桁
'numeric':ゼロサプレス
'narrow':縮小形式
'short':短い形式
'long':長い形式
day'2-digit':2桁
'numeric':ゼロサプレス
dayPeriod 'narrow':縮小形式
'short':短い形式
'long':長い形式
hour'2-digit':2桁
'numeric':ゼロサプレス
minute'2-digit':2桁
'numeric':ゼロサプレス
second'2-digit':2桁
'numeric':ゼロサプレス
fractionalSecondDigits undefined:なし
正数 (1~3):1桁~3桁
0:なし
秒の小数点以下の桁数
timeZoneName'short':短い形式
'long':長い形式
タイムゾーン名
dateStyle 'full':フル形式
'long':長い形式
'medium':標準形式
'short':短い形式
日付スタイル
timeStyle 'full':フル形式
'long':長い形式
'medium':標準形式
'short':短い形式
時刻スタイル

var date = new Date(Date.UTC(2001, (2 - 1), 3, 4, 5, 6));
var dtf = new Intl.DateTimeFormat();
console.log(dtf.format(date));
// 出力:2001/2/3

dtf = new Intl.DateTimeFormat("en-US");
console.log(dtf.format(date));
// 出力:2/3/2001

dtf = new Intl.DateTimeFormat("en-GB");
console.log(dtf.format(date));
// 出力:03/02/2001

var options = { year:'2-digit', month:'2-digit', day:'2-digit', hour12:true, hour:'2-digit', minute:'2-digit', second:'2-digit', weekday:'narrow', timeZone:'UTC', timeZoneName:'long' };
dtf = new Intl.DateTimeFormat("en-US", options);
console.log(dtf.format(date));
// 出力:S, 02/03/01, 4:05:06 AM GMT

options = { year:'numeric', month:'numeric', day:'numeric', hour12:false, hour:'2-digit', minute:'numeric', second:'numeric', weekday:'short', timeZone:'Asia/Tokyo', timeZoneName:'short' };
dtf = new Intl.DateTimeFormat("en-US", options);
console.log(dtf.format(date));
// 出力:Sat, 2/3/2001, 13:05:06 GMT+9

options = { year:'2-digit', month:'narrow', day:'2-digit', hour12:true, hour:'2-digit', minute:'2-digit', second:'2-digit', weekday:'long', timeZone:'Asia/Tokyo', timeZoneName:'long' };
dtf = new Intl.DateTimeFormat("en-US", options);
console.log(dtf.format(date));
// 出力:Saturday, F 03, 01, 1:05:06 PM Japan Standard Time

options = { year:'numeric', month:'short', day:'numeric', hour12:false, hour:'numeric', minute:'numeric', second:'numeric', weekday:'narrow', timeZone:'America/New_York', timeZoneName:'short' };
dtf = new Intl.DateTimeFormat("en-US", options);
console.log(dtf.format(date));
// 出力:F, Feb 2, 2001, 23:05:06 EST

options = { year:'2-digit', month:'long', day:'2-digit', hour12:true, hour:'numeric', minute:'2-digit', second:'2-digit', weekday:'short', timeZone:'America/New_York', timeZoneName:'long' };
dtf = new Intl.DateTimeFormat("en-US", options);
console.log(dtf.format(date));
// 出力:Fri, February 02, 01, 11:05:06 PM Eastern Standard Time

options = { era:'narrow', year:'numeric', month:'numeric', day:'numeric', hour:'numeric', minute:'numeric', second:'numeric', weekday:'narrow', hour12:true, timeZoneName:'long' };
dtf = new Intl.DateTimeFormat("ja-JP-u-ca-japanese", options);
console.log(dtf.format(date));
// 出力:H13年2月3日土 13時05分06秒 日本標準時

options = { era:'short', year:'2-digit', month:'2-digit', day:'2-digit',  hour:'2-digit', minute:'2-digit', second:'2-digit', weekday:'short', hour12:false, timeZoneName:'short' };
dtf = new Intl.DateTimeFormat("ja-JP-u-ca-japanese", options);
console.log(dtf.format(date));
// 出力:平成13年02月03日土 13:05:06 JST

options = { era:'long', year:'numeric', month:'numeric', day:'numeric', hour:'numeric', minute:'numeric', second:'numeric', weekday:'long', hour12:true, timeZoneName:'long' };
dtf = new Intl.DateTimeFormat("ja-JP-u-ca-japanese", options);
console.log(dtf.format(date));
// 出力:平成13年2月3日土曜日 13時05分06秒 日本標準時

options = { era:'long', year:'numeric', month:'long', day:'numeric', weekday:'long' };
dtf = new Intl.DateTimeFormat("ja-JP-u-ca-japanese-nu-hanidec", options);
console.log(dtf.format(date));
// 出力:平成一三年二月三日土曜日

dtf = new Intl.DateTimeFormat();
console.log(dtf.format());
// 出力:20xx/x/x 現在日付

Intl.DateTimeFormat.prototype.format【フォーマット関数】

メモ

構文

dateTimeFormat.format(date)

戻り値フォーマット文字列
date日時 (省略:現在日時)

new Intl.DateTimeFormat () 【コンストラクタ】の例を参照

// Array.map ()【配列変換生成】利用
var days = [ new Date(2001, (2 - 1), 3), new Date(2011, (3 - 1), 4), new Date(2021, (4 - 1), 5) ];
var dtf = new Intl.DateTimeFormat();
console.log(days.map(dtf.format));
// 出力:["2001/2/3", "2011/3/4", "2021/4/5"]

Intl.DateTimeFormat.prototype.formatRange【範囲フォーマット】

メモ

構文

dateTimeFormat.formatRange(startDate, endDate) 

戻り値フォーマット文字列
startDate開始日時
endDate終了日時

let dateStart = new Date(Date.UTC(2001, (2 - 1), 3, 4, 5, 6));
let dateEnd = new Date(Date.UTC(2002, (3 - 1), 4, 5, 6, 7));

let dtfEfull = new Intl.DateTimeFormat('en-US', { dateStyle: 'full', timeStyle: 'full' })
let dtfElong = new Intl.DateTimeFormat('en-US', { dateStyle: 'long', timeStyle: 'long' })
let dtfEmedium = new Intl.DateTimeFormat('en-US', { dateStyle: 'medium', timeStyle: 'medium' })
let dtfEshort = new Intl.DateTimeFormat('en-US', { dateStyle: 'short', timeStyle: 'short' })
console.log(dtfEfull.formatRange(dateStart, dateEnd));
// 出力例:Saturday, February 3, 2001, 1:05:06 PM Japan Standard Time – Monday, March 4, 2002, 2:06:07 PM Japan Standard Time
console.log(dtfElong.formatRange(dateStart, dateEnd));
// 出力例:February 3, 2001, 1:05:06 PM GMT+9 – March 4, 2002, 2:06:07 PM GMT+9
console.log(dtfEmedium.formatRange(dateStart, dateEnd));
// 出力例:Feb 3, 2001, 1:05:06 PM – Mar 4, 2002, 2:06:07 PM
console.log(dtfEshort.formatRange(dateStart, dateEnd));
// 出力例:2/3/01, 1:05 PM – 3/4/02, 2:06 PM

let dtfJfull = new Intl.DateTimeFormat('ja', { dateStyle: 'full', timeStyle: 'full' })
let dtfJlong = new Intl.DateTimeFormat('ja', { dateStyle: 'long', timeStyle: 'long' })
let dtfJmedium = new Intl.DateTimeFormat('ja', { dateStyle: 'medium', timeStyle: 'medium' })
let dtfJshort = new Intl.DateTimeFormat('ja', { dateStyle: 'short', timeStyle: 'short' })
console.log(dtfJfull.formatRange(dateStart, dateEnd));
// 出力例:2001/2/3土曜日 13時05分06秒 日本標準時~2002/3/4月曜日 14時06分07秒 日本標準時
console.log(dtfJlong.formatRange(dateStart, dateEnd));
// 出力例:2001/2/3 13:05:06 JST~2002/3/4 14:06:07 JST
console.log(dtfJmedium.formatRange(dateStart, dateEnd));
// 出力例:2001/02/03 13:05:06~2002/03/04 14:06:07
console.log(dtfJshort.formatRange(dateStart, dateEnd));
// 出力例:2001/02/03 13:05~2002/03/04 14:06

Intl.DateTimeFormat.prototype.formatToParts【フォーマットパーツ取得】
Intl.DateTimeFormat.prototype.formatRangeToParts【範囲フォーマットパーツ取得】

メモ

構文

dateTimeFormat.formatToParts ( date ) 

 (Array)フォーマットのパーツ
date日時
dateTimeFormat.formatRangeToParts(startDate, endDate) 

 (Array)フォーマットのパーツ
startDate開始日時
endDate終了日時

let date = new Date(Date.UTC(2001, (2 - 1), 3, 4, 5, 6));

let dtfEnglish = new Intl.DateTimeFormat('en-US', { dateStyle: 'full', timeStyle: 'full' })
console.log(dtfEnglish.format(date));
// 出力:Saturday, February 3, 2001 at 1:05:06 PM Japan Standard Time
console.log(dtfEnglish.formatToParts(date));
// 出力:
// Array(17)
// 0: {type: "weekday", value: "Saturday"}
// 1: {type: "literal", value: ", "}
// 2: {type: "month", value: "February"}
// 3: {type: "literal", value: " "}
// 4: {type: "day", value: "3"}
// 5: {type: "literal", value: ", "}
// 6: {type: "year", value: "2001"}
// 7: {type: "literal", value: " at "}
// 8: {type: "hour", value: "1"}
// 9: {type: "literal", value: ":"}
// 10: {type: "minute", value: "05"}
// 11: {type: "literal", value: ":"}
// 12: {type: "second", value: "06"}
// 13: {type: "literal", value: " "}
// 14: {type: "dayPeriod", value: "PM"}
// 15: {type: "literal", value: " "}
// 16: {type: "timeZoneName", value: "Japan Standard Time"}

let dtfJapanese = new Intl.DateTimeFormat('ja-JP', { dateStyle: 'full', timeStyle: 'full' })
console.log(dtfJapanese.format(date));
// 出力:2001年2月3日土曜日 13時05分06秒 日本標準時
console.log(dtfJapanese.formatToParts(date));
// 出力:
// Array(15)
// 0: {type: "year", value: "2001"}
// 1: {type: "literal", value: "年"}
// 2: {type: "month", value: "2"}
// 3: {type: "literal", value: "月"}
// 4: {type: "day", value: "3"}
// 5: {type: "literal", value: "日"}
// 6: {type: "weekday", value: "土曜日"}
// 7: {type: "literal", value: " "}
// 8: {type: "hour", value: "13"}
// 9: {type: "literal", value: "時"}
// 10: {type: "minute", value: "05"}
// 11: {type: "literal", value: "分"}
// 12: {type: "second", value: "06"}
// 13: {type: "literal", value: "秒 "}
// 14: {type: "timeZoneName", value: "日本標準時"}
let dateStart = new Date(Date.UTC(2001, (2 - 1), 3, 4, 5, 6));
let dateEnd = new Date(Date.UTC(2002, (3 - 1), 4, 5, 6, 7));

let dtfEnglish = new Intl.DateTimeFormat('en-US', { dateStyle: 'full', timeStyle: 'full' })
console.log(dtfEnglish.formatRange(dateStart, dateEnd));
// 出力:Saturday, February 3, 2001, 1:05:06 PM Japan Standard Time – Monday, March 4, 2002, 2:06:07 PM Japan Standard Time
console.log(dtfEnglish.formatRangeToParts(dateStart, dateEnd));
// 出力:
// Array(35)
// 0: {type: "weekday", value: "Saturday", source: "startRange"}
// 1: {type: "literal", value: ", ", source: "startRange"}
// 2: {type: "month", value: "February", source: "startRange"}
// 3: {type: "literal", value: " ", source: "startRange"}
// 4: {type: "day", value: "3", source: "startRange"}
// 5: {type: "literal", value: ", ", source: "startRange"}
// 6: {type: "year", value: "2001", source: "startRange"}
// 7: {type: "literal", value: ", ", source: "startRange"}
// 8: {type: "hour", value: "1", source: "startRange"}
// 9: {type: "literal", value: ":", source: "startRange"}
// 10: {type: "minute", value: "05", source: "startRange"}
// 11: {type: "literal", value: ":", source: "startRange"}
// 12: {type: "second", value: "06", source: "startRange"}
// 13: {type: "literal", value: " ", source: "startRange"}
// 14: {type: "dayPeriod", value: "PM", source: "startRange"}
// 15: {type: "literal", value: " ", source: "startRange"}
// 16: {type: "timeZoneName", value: "Japan Standard Time", source: "startRange"}
// 17: {type: "literal", value: " – ", source: "shared"}
// 18: {type: "weekday", value: "Monday", source: "endRange"}
// 19: {type: "literal", value: ", ", source: "endRange"}
// 20: {type: "month", value: "March", source: "endRange"}
// 21: {type: "literal", value: " ", source: "endRange"}
// 22: {type: "day", value: "4", source: "endRange"}
// 23: {type: "literal", value: ", ", source: "endRange"}
// 24: {type: "year", value: "2002", source: "endRange"}
// 25: {type: "literal", value: ", ", source: "endRange"}
// 26: {type: "hour", value: "2", source: "endRange"}
// 27: {type: "literal", value: ":", source: "endRange"}
// 28: {type: "minute", value: "06", source: "endRange"}
// 29: {type: "literal", value: ":", source: "endRange"}
// 30: {type: "second", value: "07", source: "endRange"}
// 31: {type: "literal", value: " ", source: "endRange"}
// 32: {type: "dayPeriod", value: "PM", source: "endRange"}
// 33: {type: "literal", value: " ", source: "endRange"}
// 34: {type: "timeZoneName", value: "Japan Standard Time", source: "endRange"}

let dtfJapanese = new Intl.DateTimeFormat('ja-JP', { dateStyle: 'full', timeStyle: 'full' })
console.log(dtfJapanese.formatRange(dateStart, dateEnd));
// 出力:2001/2/3土曜日 13時05分06秒 日本標準時~2002/3/4月曜日 14時06分07秒 日本標準時
console.log(dtfJapanese.formatRangeToParts(dateStart, dateEnd));
// 出力:
// Array(29)
// 0: {type: "year", value: "2001", source: "startRange"}
// 1: {type: "literal", value: "/", source: "startRange"}
// 2: {type: "month", value: "2", source: "startRange"}
// 3: {type: "literal", value: "/", source: "startRange"}
// 4: {type: "day", value: "3", source: "startRange"}
// 5: {type: "weekday", value: "土曜日", source: "startRange"}
// 6: {type: "literal", value: " ", source: "startRange"}
// 7: {type: "hour", value: "13", source: "startRange"}
// 8: {type: "literal", value: "時", source: "startRange"}
// 9: {type: "minute", value: "05", source: "startRange"}
// 10: {type: "literal", value: "分", source: "startRange"}
// 11: {type: "second", value: "06", source: "startRange"}
// 12: {type: "literal", value: "秒 ", source: "startRange"}
// 13: {type: "timeZoneName", value: "日本標準時", source: "startRange"}
// 14: {type: "literal", value: "~", source: "shared"}
// 15: {type: "year", value: "2002", source: "endRange"}
// 16: {type: "literal", value: "/", source: "endRange"}
// 17: {type: "month", value: "3", source: "endRange"}
// 18: {type: "literal", value: "/", source: "endRange"}
// 19: {type: "day", value: "4", source: "endRange"}
// 20: {type: "weekday", value: "月曜日", source: "endRange"}
// 21: {type: "literal", value: " ", source: "endRange"}
// 22: {type: "hour", value: "14", source: "endRange"}
// 23: {type: "literal", value: "時", source: "endRange"}
// 24: {type: "minute", value: "06", source: "endRange"}
// 25: {type: "literal", value: "分", source: "endRange"}
// 26: {type: "second", value: "07", source: "endRange"}
// 27: {type: "literal", value: "秒 ", source: "endRange"}
// 28: {type: "timeZoneName", value: "日本標準時", source: "endRange"}

Intl.DateTimeFormat.prototype.resolvedOptions()【オプション取得】

メモ

構文

dateTimeFormat.resolvedOptions()

戻り値オプション オブジェクト

var dtf = new Intl.DateTimeFormat();
console.log(dtf.resolvedOptions());
// 出力:
// object {
// calendar:"gregory"
// day:"numeric"
// locale:"ja"
// month:"numeric"
// numberingSystem:"latn"
// timeZone:"Asia/Tokyo"
// year:"numeric"
// }

console.log(dtf.format());
// 出力:20xx/xx/xx 現在日付

Intl.DateTimeFormat.supportedLocalesOf()【サポート ロケール取得】

メモ

構文

Intl.DateTimeFormat.supportedLocalesOf( locales [, options]) 

戻り値サポートされるロケールの配列
localesBCP 47 の言語タグの文字列 または 配列
new Intl.DateTimeFormat () 【コンストラクタ】localesを参照
optionsオプション (localeMatcher【ロケールマッチングアルゴリズム】)
new Intl.DateTimeFormat () 【コンストラクタ】optionsを参照

console.log(Intl.DateTimeFormat.supportedLocalesOf('ja'));
// 出力例:Array [ "ja" ]

console.log(Intl.DateTimeFormat.supportedLocalesOf('ng'));
// 出力例:Array []

let locales = ['ng', 'ja', 'ja-JP', 'en', 'en-US', 'en-GB'];
console.log(Intl.DateTimeFormat.supportedLocalesOf(locales));
// 出力例:Array(5) [ "ja", "ja-JP", "en", "en-US", "en-GB" ]

locales = ['ng', 'jpn', 'jpn-JP', 'eng', 'eng-US', 'eng-GB'];
console.log(Intl.DateTimeFormat.supportedLocalesOf(locales));
// 出力例:Array(5) [ "ja", "ja-JP", "en", "en-US", "en-GB" ]

console.log(Intl.DateTimeFormat.supportedLocalesOf(locales, { localeMatcher: 'lookup' }));
// 出力例:Array(5) [ "ja", "ja-JP", "en", "en-US", "en-GB" ]