Wie kann ich in JavaScript ein Datumsobjekt formatieren, als das gedruckt werden soll 10-Aug-2010
?
javascript
date
date-formatting
Leora
quelle
quelle
myDate.getDay()
dass der Wochentag nicht zurückgegeben wird, sondern der Ort des Wochentags sich auf die Woche bezieht.myDate.getDate()
Gibt den aktuellen Wochentag zurück .Intl.DateTimeFormat
Objekt. Ich beschreibe es in meinem Beitrag: Beitrag . Ich erstelle eine Online-Lösung für Ihre Antwort vonIntl.DateTimeFormat
Check OnlinetoLocaleDateString
Antworten:
Bei benutzerdefinierten Datumsformaten müssen Sie die Datums- (oder Zeit-) Komponenten aus einem
DateTimeFormat
Objekt (das Teil der ECMAScript Internationalization API ist ) ziehen und anschließend manuell eine Zeichenfolge mit den gewünschten Trennzeichen erstellen.Dazu können Sie Folgendes verwenden
DateTimeFormat#formatToParts
:Sie können die Teile eines
DateTimeFormat
nacheinander auch mit herausziehen.DateTimeFormat#format
Beachten Sie jedoch, dass bei Verwendung dieser Methode ab März 2020 ein Fehler in der ECMAScript-Implementierung vorliegt, wenn es darum geht, Nullen in Minuten und Sekunden zu führen (dieser Fehler) wird durch den obigen Ansatz umgangen).Wenn Sie mit Datums- und Uhrzeitangaben arbeiten , lohnt es sich normalerweise, eine Bibliothek (z. B. moment.js , luxon ) zu verwenden, da das Feld viele komplexe Komplexitäten aufweist.
Beachten Sie, dass die in den obigen Lösungen verwendete ECMAScript Internationalization API in IE10 nicht unterstützt wird ( 0,03% globaler Browser-Marktanteil im Februar 2020).
quelle
Date
Objekt ein?Wenn Sie etwas weniger Kontrolle über die Formatierung benötigen als die derzeit akzeptierte Antwort,
Date#toLocaleDateString
können Sie mit dieser Option standardmäßige länderspezifische Renderings erstellen. Dielocale
undoptions
Argumente lassen Anwendungen , die die Sprache angeben , der Darstellungskonventionen verwendet werden soll, und eine gewisse Anpassung des Rendering ermöglichen.Schlüsselbeispiele für Optionen:
Die Darstellung des Tages.
Mögliche Werte sind "numerisch", "zweistellig".
Die Darstellung des Wochentags.
Mögliche Werte sind "eng", "kurz", "lang".
Die Darstellung des Jahres.
Mögliche Werte sind "numerisch", "zweistellig".
Die Darstellung des Monats.
Mögliche Werte sind "numerisch", "zweistellig", "schmal", "kurz", "lang".
Die Darstellung der Stunde.
Mögliche Werte sind "numerisch", "zweistellig".
Mögliche Werte sind "numerisch", "zweistellig".
Die Darstellung der Sekunde.
Mögliche Werte sind "numerisch", zweistellig ".
Alle diese Schlüssel sind optional. Sie können die Anzahl der Optionswerte basierend auf Ihren Anforderungen ändern. Dies spiegelt auch das Vorhandensein der einzelnen Datums- und Zeitangaben wider.
Hinweis: Wenn Sie nur die Inhaltsoptionen konfigurieren möchten, aber dennoch das aktuelle Gebietsschema verwenden möchten, führt
null
die Übergabe des ersten Parameters zu einem Fehler. Verwenden Sieundefined
stattdessen.Für verschiedene Sprachen:
Sie können weitere Sprachoptionen verwenden.
Zum Beispiel
Sie können die
toLocaleString()
Methode auch für denselben Zweck verwenden. Der einzige Unterschied besteht darin, dass diese Funktion die Zeit angibt, zu der Sie keine Optionen übergeben.Verweise:
toLocaleString()
toLocaleDateString()
quelle
moment.js
für ein einfaches Format zu verwenden. Glücklicherweise wurde eine zusätzliche Google-Suche durchgeführt und festgestellt, dass bereits eine native API dies tut. Eine externe Abhängigkeit wurde gespeichert. Genial!undefined
als erster Gebietsschemaparameter willkürlich ist, können Sie stattdessen den Wert übergeben"default"
, um die Gebietsschemaeinstellungen des Browsers gemäß den MDN-Dokumenten zu verwenden. Developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…date.toLocaleDateString("en-US", { day: 'numeric' }) + "-"+ date.toLocaleDateString("en-US", { month: 'short' }) + "-" + date.toLocaleDateString("en-US", { year: 'numeric' })
sollte geben16-Nov-2019
Verwenden Sie die date.format-Bibliothek :
kehrt zurück:
Datumsformat auf npm
http://jsfiddle.net/phZr7/1/
quelle
require is not defined
Wenn Sie benötigen , um schnell Ihr Datumsformat Ebene JavaScript, Verwendung
getDate
,getMonth + 1
,getFullYear
,getHours
undgetMinutes
:Oder wenn es mit Nullen aufgefüllt werden muss:
quelle
toLocaleDateString()
können das Datum mit lokalisierten Monats- / Tagesnamen formatieren..toString().padStart(2, '0')
("000" + d.getFullYear()).slice(-4)
String.padStart()
nur von ECMAScript 2017 verfügbar ist.Nun, ich wollte das heutige Datum in eine MySQL- freundliche Datumszeichenfolge wie den 23.06.2012 konvertieren und diese Zeichenfolge als Parameter in einer meiner Abfragen verwenden. Die einfache Lösung, die ich gefunden habe, ist folgende:
Beachten Sie, dass die obige Lösung Ihren Zeitzonenversatz nicht berücksichtigt.
Sie können stattdessen diese Funktion verwenden:
Dies gibt Ihnen das richtige Datum, falls Sie diesen Code am Anfang / Ende des Tages ausführen.
quelle
new Date(date + " UTC")
die Zeitzone austricksen und die setMinutes-Zeile entfernen. Mann, Javascript ist schmutzigvar today = new Date().toISOString().slice(0,-14)
:)new Date().toISOString().split('T')[0]
new Date().toISOString().slice(0, 16).replace('T',' ')
ZeitBenutzerdefinierte Formatierungsfunktion:
Bei festen Formaten erledigt eine einfache Funktion den Job. Das folgende Beispiel generiert das internationale Format JJJJ-MM-TT:
Das OP-Format kann wie folgt generiert werden:
Hinweis: Es ist jedoch normalerweise keine gute Idee, die JavaScript-Standardbibliotheken zu erweitern (z. B. durch Hinzufügen dieser Funktion zum Prototyp von Date).
Eine erweiterte Funktion könnte eine konfigurierbare Ausgabe basierend auf einem Formatparameter generieren.
Wenn das Schreiben einer Formatierungsfunktion zu lang ist, gibt es viele Bibliotheken, in denen dies möglich ist. Einige andere Antworten führen sie bereits auf. Zunehmende Abhängigkeiten haben aber auch ein Gegenstück.
Standardfunktionen zur ECMAScript-Formatierung:
Seit neueren Versionen von ECMAScript verfügt die
Date
Klasse über einige spezifische Formatierungsfunktionen:Hinweis: Aus diesen Formatierungen kann eine benutzerdefinierte Ausgabe generiert werden>
Beispiele für Ausschnitte:
quelle
new Date().toLocaleDateString()
gibt dir bittemm/dd/yyyy
nicht dasdd/mm/yyyy
korrigieren.Wenn Sie in Ihrem Projekt bereits die jQuery-Benutzeroberfläche verwenden, können Sie dies folgendermaßen tun:
Einige Datumsauswahl-Datumsformatoptionen zum Spielen sind hier verfügbar .
quelle
Ich denke, Sie können einfach die nicht standardmäßige Datumsmethode verwenden
toLocaleFormat(formatString)
formatString: Eine Formatzeichenfolge im gleichen Format, die von der
strftime()
Funktion in C erwartet wird .Verweise:
quelle
Normales JavaScript ist die beste Wahl für kleine Onetimer.
Auf der anderen Seite ist MomentJS eine großartige Lösung , wenn Sie mehr Daten benötigen .
Zum Beispiel:
quelle
YYYY
sei denn, Sie kennen den Unterschied zwischenYYYY
undyyyy
: stackoverflow.com/questions/15133549/…YYYY
(nichtyyyy
) das Standardjahr undGGGG
(nichtYYYY
) das ISO-Wochenjahr ist.In modernen Browsern (*) können Sie dies einfach tun:
Ausgabe bei heutiger Ausführung (24. Januar 2016):
(*) Laut MDN bedeutet "moderne Browser" die nächtliche Erstellung von Chrome 24+, Firefox 29+, Internet Explorer 11, Edge 12+, Opera 15+ und Safari .
quelle
Sie sollten sich date.js ansehen . Es werden viele praktische Helfer für die Arbeit mit Daten hinzugefügt, zum Beispiel in Ihrem Fall:
Erste Schritte: http://www.datejs.com/2007/11/27/getting-started-with-datejs/
quelle
Ich kann Ihr gewünschtes Format in einer Zeile ohne Bibliotheken und ohne Datumsmethoden erhalten, nur Regex:
In meinen Tests funktioniert dies zuverlässig in den wichtigsten Browsern (Chrome, Safari, Firefox und IE). Wie @RobG hervorhob, ist die Ausgabe von Date.prototype.toString () implementierungsabhängig. Testen Sie also einfach die Ausgabe, um sicherzugehen Es funktioniert direkt in Ihrer JavaScript-Engine. Sie können sogar Code hinzufügen, um die Zeichenfolgenausgabe zu testen und sicherzustellen, dass sie Ihren Erwartungen entspricht, bevor Sie den regulären Ausdruck ersetzen.
quelle
console.log(new Date().toString().replace(/\S+\s(\S+)\s(\d+)\s(\d+)\s.*/,'$2-$1-$3'));
@ Sébastien - Alternative alle Browser-Unterstützung
Dokumentation: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString
quelle
new Date().toLocaleDateString("en-EN", {month: "short", weekday: "short", day: "2-digit", year: "numeric"})
kehrt zurück"Wed, Sep 06, 2017"
OK , wir haben etwas namens Intl, das heutzutage sehr nützlich ist, um ein Datum in JavaScript zu formatieren:
Ihr Datum wie folgt:
Und Sie wechseln zu Datum, indem Sie neues Datum () wie folgt verwenden:
Und jetzt können Sie es nach Belieben formatieren, indem Sie eine Liste von Gebietsschemas wie folgt verwenden:
Wenn Sie genau das oben erwähnte Format möchten, können Sie Folgendes tun:
Und das Ergebnis wird sein:
Weitere Informationen finden Sie in der Dokumentation zu Intl API und Intl.DateTimeFormat .
quelle
Verwenden einer Zeichenfolgenvorlage für ECMAScript Edition 6 (ES6 / ES2015):
Wenn Sie die Trennzeichen ändern müssen:
quelle
Verpackte Lösung: Luxon
Wenn Sie eine Lösung für alle verwenden möchten, empfehle ich dringend die Verwendung von Luxon (einer modernisierten Version von Moment.js ), das auch in vielen Gebietsschemas / Sprachen und vielen anderen Funktionen formatiert.
Luxon wird auf der Moment.js-Website gehostet und von einem Moment.js-Entwickler entwickelt, da Moment.js Einschränkungen aufweist, die der Entwickler ansprechen wollte, aber nicht konnte.
Installieren:
npm install luxon
oderyarn add luxon
(Link für andere Installationsmethoden besuchen)Beispiel:
luxon.DateTime.fromISO('2010-08-10').toFormat('yyyy-LLL-dd');
Ausbeuten:
Manuelle Lösung
Mit ähnlichen Formatierungen wie Moment.js, Class DateTimeFormatter (Java) und Class SimpleDateFormat (Java) habe ich eine umfassende Lösung implementiert,
formatDate(date, patternStr)
bei der der Code leicht zu lesen und zu ändern ist. Sie können Datum, Uhrzeit, AM / PM usw. anzeigen. Weitere Beispiele finden Sie im Code.Beispiel:
formatDate(new Date(), 'EEEE, MMMM d, yyyy HH:mm:ss:S')
(
formatDate
ist im folgenden Code-Snippet implementiert)Ausbeuten:
Probieren Sie den Code aus, indem Sie auf "Code-Snippet ausführen" klicken.
Datums- und Zeitmuster
yy
= Zweistelliges Jahr;yyyy
= volles JahrM
= Ziffernmonat;MM
= Zweistelliger Monat;MMM
= kurzer Monatsname;MMMM
= vollständiger MonatsnameEEEE
= vollständiger Wochentagsname;EEE
= kurzer Wochentagsnamed
= Zifferntag;dd
= 2-stelliger Tagh
= Stunden morgens / abends;hh
= Zweistellige Stunden am / pm;H
= Stunden;HH
= Zweistellige Stundenm
= Minuten;mm
= Zweistellige Minuten;aaa
= AM / PMs
= Sekunden;ss
= 2-stellige SekundenS
= MillisekundenVielen Dank an @Gerry, dass Sie Luxon erwähnt haben.
quelle
SimpleDateFormat
Klasse vor Jahren von derjava.time.format.DateTimeFormatter
Klasse abgelöst.Hier ist ein Code, den ich gerade geschrieben habe, um die Datumsformatierung für ein Projekt zu handhaben, an dem ich arbeite. Es ahmt die PHP-Datumsformatierungsfunktion nach, die meinen Anforderungen entspricht. Fühlen Sie sich frei, es zu verwenden, es erweitert nur das bereits vorhandene Date () -Objekt. Dies ist vielleicht nicht die eleganteste Lösung, aber sie funktioniert für meine Bedürfnisse.
quelle
Eine JavaScript-Lösung ohne Verwendung externer Bibliotheken:
quelle
Weitere Dokumentation unter developer.mozilla.org
quelle
Wenn Sie die jQuery-Benutzeroberfläche in Ihrem Code verwenden, wird eine integrierte Funktion aufgerufen
formatDate()
. Ich benutze es so, um das heutige Datum zu formatieren:In der Dokumentation zur jQuery-Benutzeroberfläche finden Sie viele weitere Beispiele für das Formatierungsdatum .
quelle
Wir haben viele Lösungen dafür, aber ich denke, die beste davon ist Moment.js. Ich persönlich schlage daher vor, Moment.js für Datums- und Zeitoperationen zu verwenden.
quelle
Eine nützliche und flexible Möglichkeit zum Formatieren der DateTimes in JavaScript ist
Intl.DateTimeFormat
:Ergebnis ist:
"12-Oct-2017"
Die Datums- und Uhrzeitformate können mithilfe des Optionsarguments angepasst werden.
Das
Intl.DateTimeFormat
Objekt ist ein Konstruktor für Objekte, die eine sprachempfindliche Formatierung von Datum und Uhrzeit ermöglichen.Syntax
Parameter
Gebietsschemas
Optional. Eine Zeichenfolge mit einem BCP 47-Sprach-Tag oder ein Array solcher Zeichenfolgen. Die allgemeine Form und Interpretation des Gebietsschemas finden Sie auf der Seite Intl. Die folgenden Unicode-Erweiterungsschlüssel sind zulässig:
Optionen
Optional. Ein Objekt mit einigen oder allen der folgenden Eigenschaften:
localeMatcher
Der zu verwendende Gebietsschema-Matching-Algorithmus. Mögliche Werte sind
"lookup"
und"best fit"
; Der Standardwert ist"best fit"
. Informationen zu dieser Option finden Sie auf der Seite Intl.Zeitzone
Die zu verwendende Zeitzone. Der einzige Wert, den Implementierungen erkennen müssen, ist
"UTC"
: Der Standardwert ist die Standardzeitzone der Laufzeit. Implementierungen können auch die Zeitzonennamen der IANA Zeitzonendatenbank erkennen, wie"Asia/Shanghai"
,"Asia/Kolkata"
,"America/New_York"
.Stunde12
Gibt an, ob eine 12-Stunden-Zeit verwendet werden soll (im Gegensatz zu einer 24-Stunden-Zeit). Mögliche Werte sind
true
undfalse
; Die Standardeinstellung ist vom Gebietsschema abhängig.formatMatcher
Der zu verwendende Formatanpassungsalgorithmus. Mögliche Werte sind
"basic"
und"best fit"
; Der Standardwert ist"best fit"
. Informationen zur Verwendung dieser Eigenschaft finden Sie in den folgenden Abschnitten.Die folgenden Eigenschaften beschreiben die Datums- / Uhrzeitkomponenten, die in der formatierten Ausgabe verwendet werden sollen, und ihre gewünschten Darstellungen. Implementierungen sind erforderlich, um mindestens die folgenden Teilmengen zu unterstützen:
Implementierungen unterstützen möglicherweise andere Teilmengen, und Anforderungen werden gegen alle verfügbaren Teilmengen-Repräsentationskombinationen ausgehandelt, um die beste Übereinstimmung zu finden. Für diese Aushandlung stehen zwei Algorithmen zur Verfügung, die von der formatMatcher-Eigenschaft ausgewählt werden: Ein vollständig spezifizierter
"basic"
Algorithmus und ein implementierungsabhängiger "Best-Fit" -Algorithmus.Wochentag
Die Darstellung des Wochentags. Mögliche Werte sind
"narrow"
,"short"
,"long"
.Epoche
Die Darstellung der Ära. Mögliche Werte sind
"narrow"
,"short"
,"long"
.Jahr
Die Darstellung des Jahres. Mögliche Werte sind
"numeric"
,"2-digit"
.Monat
Die Darstellung des Monats. Mögliche Werte sind
"numeric"
,"2-digit"
,"narrow"
,"short"
,"long"
.Tag
Die Darstellung des Tages. Mögliche Werte sind
"numeric"
,"2-digit"
.Stunde
Die Darstellung der Stunde. Mögliche Werte sind
"numeric"
,"2-digit"
.Minute
Die Darstellung der Minute. Mögliche Werte sind
"numeric"
,"2-digit"
.zweite
Die Darstellung des zweiten. Mögliche Werte sind
"numeric"
,"2-digit"
.timeZoneName
Die Darstellung des Zeitzonennamens. Mögliche Werte sind
"short"
,"long"
. Der Standardwert für jede Datums- / Uhrzeit-Komponenteneigenschaft ist undefiniert. Wenn jedoch alle Komponenteneigenschaften undefiniert sind, werden Jahr, Monat und Tag angenommen"numeric"
.Online prüfen
Mehr Details
quelle
Dies kann bei dem Problem helfen:
quelle
d.toLocaleDateString('en-US', options);
wenn Sie in den USA sind.So habe ich meine npm-Plugins implementiert
quelle
March
wird3arch
mit diesem Code.'M'
bisformat = format.replace("M(?!M)", (dt.getMonth()+1).toString());
und setzen Sie sie über die Zeile mit'MMMM'
quelle
Sugar.js verfügt über hervorragende Erweiterungen des Date-Objekts, einschließlich einer Date.format- Methode.
Beispiele aus der Dokumentation:
quelle
Für alle, die nach einer wirklich einfachen ES6-Lösung zum Kopieren, Einfügen und Übernehmen suchen:
quelle
Ab 2019 können Sie toLocaleDateString so einstellen, dass nur bestimmte Teile zurückgegeben werden. Anschließend können Sie sie nach Belieben verbinden:
quelle
Sie sollten sich DayJs ansehen. Es ist ein Remake von Momenten, aber die modulare Architektur ist so leicht ausgerichtet.
Schnelle 2-KB-Alternative zu Moment.js mit derselben modernen API
quelle
Um "10-Aug-2010" zu erhalten, versuchen Sie:
Informationen zur Browserunterstützung finden Sie unter toLocaleDateString .
quelle