Das Intl.DateTimeFormat Objekt ist ein Konstruktor für Objekte, die sprachsensitive Formatierung von Datums- und Zeitangaben ermöglicht.
The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
Syntax
new Intl.DateTimeFormat([locales[, options]])
Intl.DateTimeFormat.call(this[, locales[, options]])
Parameter
locales- Optional. Ein String mit einem BCP 47 Sprachcode, oder einem Array von Sprachcodes. Für die generelle Form und Interpretation des
localesArguments siehe auf der Intl Seite. Die folgenden Unicode Erweiterungen sind erlaubt: -
nu- Zahlensysteme. Mögliche Werte sind:
"arab","arabext","bali","beng","deva","fullwide","gujr","guru","hanidec","khmr","knda","laoo","latn","limb","mlym","mong","mymr","orya","tamldec","telu","thai","tibt". ca- Kalender. Mögliche Werte sind:
"buddhist","chinese","coptic","ethioaa","ethiopic","gregory","hebrew","indian","islamic","islamicc","iso8601","japanese","persian","roc". hc- Stundenzyklus. Mögliche Werte sind:
"h11","h12","h23","h24".
options-
Optional. Ein Objekt mit einigen oder allen folgenden Eigenschaften:
localeMatcher- Der Sprachfindungsalgorithmus, der eingesetzt wird. Mögliche Werte sind
"lookup"und"best fit". Als Standard ist"best fit"vorgegeben. Für Informationen über diese Option siehe auf der Intl Seite nach. timeZone- Die eingesetzte Zeitzone. Der einzige Wert, den alle Implementierungen verstehen ist
"UTC". Der Standardwert ist die Standard-Laufzeitzeitzone. Manche Implementierungen erkennen auch die Namen der IANA Zeitzonendatenbank, wie zum Beispiel"Asia/Shanghai","Asia/Kolkata"und"America/New_York". hour12- Wird eingesetzt, wenn 12-Stunden Zeitangaben eingesetzt werden (im gegensatz zu 24-Stunden Zeitangaben). Mögliche Werte sind
trueundfalse. Diese Option überschreibt denhcSprachen-Tag und/oderhourCyclewenn beide vorhanden sind. hourCycle- Der eingesetzte Stundenzyklus. Mögliche Werte sind
"h11","h12","h23"oder"h24". Diese Option überschreibt denhcSprachen-Tag, wenn beide präsent sind und diehour12Option hat Vorrang, wenn beide Optionen spezifiziert sind. formatMatcher- Der eingesetzte Formaterkennungsalgorithmus. Mögliche Werte sind
"basic"und"best fit". Der Standard ist"best fit". Siehe folgenden Absatz, um den Einsatz dieses Parameters zu verstehen.
Die folgenden Eigenschaften beschreiben die Datums-Zeit-Komponenten, die für die formatierten Ausgabe eingesetzt werden und deren Repräsentation. Implementierungen müssen folgende Kombinationen der Eigenschaften unterstützen:
Wochentag, Jahr, Monat, Tag, Stunde, Minute, SekundeWochentag, Jahr, Monat, TagJahr, Monat, TagJahr, MonatMonat, TagStunde, Minute, SekundeStunde, Minute
Manche Implementierungen unterstützen weitere Kombinationen der Parameter. Es wird immer auf alle möglichen Kombinationen geprüft, um den besten Treffer zu landen. Zwei Algorithmen sind für die Auswahl der Kombination vorhanden: Ein voll spezifizierter
"basic"Algorithmus und ein implementierungsabhängiger"best fit"Algorithmus.weekday- Die Repräsentation der Wochentage. Mögliche Werte sind
"narrow","short"und"long". era- Die Repräsentation der Epoche. Mögliche Werte sind
"narrow","short"und"long". year- Die Repräsentation des Jahres. Mögliche Werte sind
"numeric"und"2-digit". month- Die Repräsentation des Monats. Mögliche Werte sind
"numeric","2-digit","narrow","short"und"long". day- Die Repräsentation des Tages. Mögliche Werte sind
"numeric"und"2-digit". hour- Die Repräsentation der Stunden. Mögliche Werte sind
"numeric"und"2-digit". minute- Die Repräsentation der Minuten. Mögliche Werte sind
"numeric"und"2-digit". second- Die Repräsentation der Sekunden. Mögliche Werte sind
"numeric"und"2-digit". timeZoneName- Die Repräsentation des Zeitzonennamens. Mögliche Werte sind
"short"und"long".
Die Standardwerte für jede Datums-Zeit-Komponente ist
undefined, wenn jedoch alle Komponentenundefinedsind, wirdyear,month, anddayals"numeric"angenommen.
Beschreibung
Eigenschaften
Intl.DateTimeFormat.prototype- Ermögliche es Eigenschaften und Methoden für alle Objekte zu definieren.
Methoden
Intl.DateTimeFormat.supportedLocalesOf()- Gibt ein Array an Sprachen zurück, die unterstützt werden, ohne dass auf den Laufzeitumgebungsstandard zurückgegriffen wird.
DateTimeFormat Instanzen
Eigenschaften
DateTimeFormat Instanzen erben die folgenden Eigenschaften von ihrem Prototypen:
Intl.DateTimeFormat.prototype.constructor- Eine Referenz zu
Intl.DateTimeFormat. Intl.DateTimeFormat.prototype.format- Getter, der eine Funktion, die für das Formatieren von Datums- und Zeitangaben nach den Optionen des
DateTimeFormatermöglicht, wird zurückgegeben.
Methoden
DateTimeFormat Instanzen erben die folgenden Methoden von ihrem Prototypen:
Intl.DateTimeFormat.prototype.formatToParts()- Gibt ein
Arrayvon Objekten zurück, die den formatierten String in Teilen repräsentiert. Das kann eingesetzt werden, um ein benutzerdefiniertes Format zu erstellen. Intl.DateTimeFormat.prototype.resolvedOptions()- Gibt ein neues Objekt mit den Eigenschaften der Sprache und des Formates zum Erstellungszeitpunkt des Objektes zurück.
Beispiele
Einsatz von DateTimeFormat
Der Basiseinsatz ohne extra Sprach- und Formatierungsoptionen, sondern den Standardeinstellungen.
var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0)); // toLocaleString ohne Argumente ist von der implementierunge, // der Standardsprache und der Standardzeitzone abhängig. console.log(new Intl.DateTimeFormat().format(date)); // → "12/19/2012" wenn das Gebiet en-US mit der Zeitzone America/Los_Angeles (UTC-0800) der Standard ist.
Einsatz von locales
Das folgende Beispiel zeigt verschiedene Formatierungsoptionen von Datums- und Zeitformaten. Um sicherzustellen, dass das Format der Sprache eingesetzt wird, die in der Benutzerschnittstelle benutzt wird, muss diese (und mögliche Rückfallsprachen) mit dem locales Argument eingestellt werden.
var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
// Die folgenden Formate setzen die Zeitzone America/Los_Angeles
// für die Sprache US voraus.
// US englisch: Monat-Tag-Jahr
console.log(new Intl.DateTimeFormat('en-US').format(date));
// → "12/19/2012"
// Britisch englisch: Tag-Monat-Jahr
console.log(new Intl.DateTimeFormat('en-GB').format(date));
// → "20/12/2012"
// Koreanisch: Jahr-Monat-Tag
console.log(new Intl.DateTimeFormat('ko-KR').format(date));
// → "2012. 12. 20."
// Arabisch: In den meisten arabischen Ländern werden arabische Ziffern genutzt
console.log(new Intl.DateTimeFormat('ar-EG').format(date));
// → "٢٠/١٢/٢٠١٢"
// Japanisch: In Japan wird der japanische Kalender eingesetzt:
// 2012 ist in diesem das Jahr 24 der Heisei Ära.
console.log(new Intl.DateTimeFormat('ja-JP-u-ca-japanese').format(date));
// → "24/12/20"
// Einsatz von Sprachen, die vielleicht nicht unterstützt werden:
// Balinesisch, und Indonesisch als Rückfallsprache.
console.log(new Intl.DateTimeFormat(['ban', 'id']).format(date));
// → "20/12/2012"
Einsatz von options
Das Datums- und Zeitformat kann mit dem Einsatz des options Arguments vom Benutzer definiert werden.
var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
// Langer Wochentag mit langem Datum
var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
console.log(new Intl.DateTimeFormat('de-DE', options).format(date));
// → "Donnerstag, 20. Dezember 2012"
// sichtbares UTC
options.timeZone = 'UTC';
options.timeZoneName = 'short';
console.log(new Intl.DateTimeFormat('en-US', options).format(date));
// → "Thursday, December 20, 2012, GMT"
// Präzisere Angaben der Zeit
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"
// 24-Stunden Angabe in US Zeiten
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"
Spezifikationen
Browserkompatibilität
| Desktop | Mobile | Server | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
DateTimeFormat | Chrome Vollständige Unterstützung 24 | Edge Vollständige Unterstützung 12 | Firefox Vollständige Unterstützung 29 | IE Vollständige Unterstützung 11 | Opera Vollständige Unterstützung 15 | Safari Vollständige Unterstützung 10 | WebView Android Vollständige Unterstützung 4.4 | Chrome Android Vollständige Unterstützung 26 | Firefox Android Vollständige Unterstützung 56 | Opera Android Vollständige Unterstützung 14 | Safari iOS Vollständige Unterstützung 10 | Samsung Internet Android Vollständige Unterstützung 1.5 | nodejs Vollständige Unterstützung Ja |
dateStyle | Chrome Vollständige Unterstützung 76 | Edge Keine Unterstützung Nein | Firefox Keine Unterstützung Nein | IE Keine Unterstützung Nein | Opera Vollständige Unterstützung 63 | Safari ? | WebView Android Vollständige Unterstützung 76 | Chrome Android Vollständige Unterstützung 76 | Firefox Android Keine Unterstützung Nein | Opera Android Keine Unterstützung Nein | Safari iOS ? | Samsung Internet Android Keine Unterstützung Nein | nodejs Vollständige Unterstützung Ja |
format | Chrome Vollständige Unterstützung 24 | Edge Vollständige Unterstützung 12 | Firefox Vollständige Unterstützung 29 | IE Vollständige Unterstützung 11 | Opera Vollständige Unterstützung 15 | Safari Vollständige Unterstützung 10 | WebView Android Keine Unterstützung Nein | Chrome Android Vollständige Unterstützung 26 | Firefox Android Vollständige Unterstützung 56 | Opera Android ? | Safari iOS Vollständige Unterstützung 10 | Samsung Internet Android Vollständige Unterstützung 1.5 | nodejs ? |
formatRange | Chrome Vollständige Unterstützung 76 | Edge Keine Unterstützung Nein | Firefox Keine Unterstützung Nein | IE Keine Unterstützung Nein | Opera Keine Unterstützung Nein | Safari Keine Unterstützung Nein | WebView Android Vollständige Unterstützung 76 | Chrome Android Vollständige Unterstützung 76 | Firefox Android Keine Unterstützung Nein | Opera Android Keine Unterstützung Nein | Safari iOS Keine Unterstützung Nein | Samsung Internet Android Keine Unterstützung Nein | nodejs Keine Unterstützung Nein |
formatRangeToParts | Chrome Vollständige Unterstützung 76 | Edge Keine Unterstützung Nein | Firefox Keine Unterstützung Nein | IE Keine Unterstützung Nein | Opera Keine Unterstützung Nein | Safari Keine Unterstützung Nein | WebView Android Vollständige Unterstützung 76 | Chrome Android Vollständige Unterstützung 76 | Firefox Android Keine Unterstützung Nein | Opera Android Keine Unterstützung Nein | Safari iOS Keine Unterstützung Nein | Samsung Internet Android Keine Unterstützung Nein | nodejs Keine Unterstützung Nein |
formatToParts | Chrome
Vollständige Unterstützung
57
| Edge Vollständige Unterstützung 18 | Firefox Vollständige Unterstützung 51 | IE Keine Unterstützung Nein | Opera Vollständige Unterstützung Ja | Safari Vollständige Unterstützung 11 | WebView Android
Vollständige Unterstützung
57
| Chrome Android
Vollständige Unterstützung
57
| Firefox Android Vollständige Unterstützung 56 | Opera Android Keine Unterstützung Nein | Safari iOS Vollständige Unterstützung 11 | Samsung Internet Android
Vollständige Unterstützung
7.0
| nodejs Vollständige Unterstützung Ja |
hourCycle | Chrome Vollständige Unterstützung 73 | Edge Vollständige Unterstützung 18 | Firefox Vollständige Unterstützung 58 | IE Keine Unterstützung Nein | Opera Vollständige Unterstützung 60 | Safari ? | WebView Android Vollständige Unterstützung 73 | Chrome Android Vollständige Unterstützung 73 | Firefox Android Vollständige Unterstützung 58 | Opera Android Vollständige Unterstützung 52 | Safari iOS ? | Samsung Internet Android Keine Unterstützung Nein | nodejs ? |
IANA time zone names in timeZone option | Chrome Vollständige Unterstützung 24 | Edge Vollständige Unterstützung 14 | Firefox Vollständige Unterstützung 52 | IE Keine Unterstützung Nein | Opera Vollständige Unterstützung 15 | Safari Vollständige Unterstützung 10 | WebView Android Vollständige Unterstützung 37 | Chrome Android Vollständige Unterstützung 26 | Firefox Android Vollständige Unterstützung 56 | Opera Android ? | Safari iOS Vollständige Unterstützung 10 | Samsung Internet Android Vollständige Unterstützung 1.5 | nodejs ? |
prototype | Chrome Vollständige Unterstützung 24 | Edge Vollständige Unterstützung 12 | Firefox Vollständige Unterstützung 29 | IE Vollständige Unterstützung 11 | Opera Vollständige Unterstützung 15 | Safari Vollständige Unterstützung 10 | WebView Android Keine Unterstützung Nein | Chrome Android Vollständige Unterstützung 26 | Firefox Android Vollständige Unterstützung 56 | Opera Android ? | Safari iOS Vollständige Unterstützung 10 | Samsung Internet Android Vollständige Unterstützung 1.5 | nodejs ? |
resolvedOptions | Chrome Vollständige Unterstützung 24 | Edge Vollständige Unterstützung 12 | Firefox Vollständige Unterstützung 29 | IE Vollständige Unterstützung 11 | Opera Vollständige Unterstützung 15 | Safari Vollständige Unterstützung 10 | WebView Android Keine Unterstützung Nein | Chrome Android Vollständige Unterstützung 26 | Firefox Android Vollständige Unterstützung 56 | Opera Android ? | Safari iOS Vollständige Unterstützung 10 | Samsung Internet Android Vollständige Unterstützung 1.5 | nodejs ? |
supportedLocalesOf | Chrome Vollständige Unterstützung 24 | Edge Vollständige Unterstützung 12 | Firefox Vollständige Unterstützung 29 | IE Vollständige Unterstützung 11 | Opera Vollständige Unterstützung 15 | Safari Vollständige Unterstützung 10 | WebView Android Keine Unterstützung Nein | Chrome Android Vollständige Unterstützung 26 | Firefox Android Vollständige Unterstützung 56 | Opera Android ? | Safari iOS Vollständige Unterstützung 10 | Samsung Internet Android Vollständige Unterstützung 1.5 | nodejs ? |
timeStyle | Chrome Vollständige Unterstützung 76 | Edge Keine Unterstützung Nein | Firefox Keine Unterstützung Nein | IE Keine Unterstützung Nein | Opera Vollständige Unterstützung 63 | Safari ? | WebView Android Vollständige Unterstützung 76 | Chrome Android Vollständige Unterstützung 76 | Firefox Android Keine Unterstützung Nein | Opera Android Keine Unterstützung Nein | Safari iOS ? | Samsung Internet Android Keine Unterstützung Nein | nodejs Vollständige Unterstützung Ja |
Legende
- Vollständige Unterstützung
- Vollständige Unterstützung
- Keine Unterstützung
- Keine Unterstützung
- Kompatibilität unbekannt
- Kompatibilität unbekannt
- Siehe Implementierungshinweise.
- Siehe Implementierungshinweise.