Comment formater une date de JavaScript
Comment puis-je formater un JavaScript date de l'objet à imprimer comme 10-Aug-2010
?
- Comme d'habitude: méfiez-vous, LE MOIS est ZÉRO INDEXÉS ! Si janvier est de zéro, pas un...
- Aussi méfiez-vous,
myDate.getDay()
ne renvoie pas le jour de la semaine, mais le localisation du jour de la semaine liées à la semaine.myDate.getDate()
retourne le jour de la semaine. - Pour la mise en forme DateTimes en javascript utiliser le
Intl.DateTimeFormat
objet. Je le décris dans mon post: la Poste. J'ai créer une solution en ligne pour votre réponse parIntl.DateTimeFormat
Vérifier en Ligne - Vous pouvez utiliser
toLocaleDateString
- En passant par toutes les réponses et de voir comment tant de gens sont laminage manuel d'analyse de chaînes pour quelque chose qui devrait déjà comme un standard de la bibliothèque en javascript...... javascript freaken suce.
- vous ne pouvez pas. developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/...
- Il a fallu javascript tellement de temps pour obtenir l'URL d'un objet normalisé, où vous pouvez arracher une requête param clé, prenez le protocole, prenez le domaine de premier niveau, etc. Ils peuvent faire ES6 ES7, mais ne peut toujours pas mettre une date de référence en temps formateur/parser en 2019? C'est comme si ils pensent "hmmm oui... qui sur la terre à l'aide de javascript aurait un besoin de traiter avec les heures et les dates sur une base régulière...."
Vous devez vous connecter pour publier un commentaire.
JS:
Vous pouvez modifier le tableau
monthNames
à utiliser Jan, Fév, Mar, etc..Date
objet, comme je l'ai fait dans le stackoverflow.com/questions/3187790/...Date
objet pour le faire?date.getMonth()
retourne0-11
, si vous souhaitez les ajouter1
si vous prévoyez de l'utiliser directement le numéro.10 August 2010
au lieu de10-Aug-2010
b) réinvente la roue, comme d'autres commentateurs ont suggéré momentjs est une bonne option, c) ne prend pas en compte pour les locales, il est donc inutile dans une application internationaliséeformat
fonction, ce qui permettra de résoudre tous les problèmes.Utilisation
toLocaleDateString()
La
toLocaleDateString()
méthode retourne une chaîne de caractères avec un langage sensible à la représentation de la partie date de la date. Les lieux et les options arguments permettent aux applications de spécifier la langue dans laquelle les conventions de mise en forme doivent être utilisés et permettent de personnaliser le comportement de la fonction.Les valeurs que vous pouvez passé dans les options pour les touches différentes:
La représentation de la journée.
Les valeurs possibles sont "numérique", "2 chiffres".
La représentation du jour de la semaine.
Les valeurs possibles sont "étroit", "court", "long".
La représentation de l'année.
Les valeurs possibles sont "numérique", "2 chiffres".
La représentation du mois.
Les valeurs possibles sont "numérique", "2-digit", "étroit", "court", "long".
La représentation de l'heure.
Les valeurs possibles sont "numérique", "2 chiffres".
La représentation de la minute.
Les valeurs possibles sont "numérique", "2 chiffres".
La représentation de la seconde.
Les valeurs possibles sont "numérique", de 2 chiffres".
Toutes ces touches sont en option. Vous pouvez modifier le nombre de valeurs des options en fonction de vos besoins, et ce sera aussi tenir compte de la présence de chaque date heure durée.
Remarque: Si vous ne voulez configurer les options de contenu, mais toujours utiliser les paramètres régionaux actuels, en passant
null
pour le premier paramètre entraîne une erreur. Utilisationundefined
à la place.Pour les différentes langues:
Vous pouvez utiliser plusieurs options de langue.
Par exemple
JS:
Vous pouvez également utiliser le
toLocaleString()
méthode pour le même but. La seule différence est que cette fonction fournit à la fois lorsque vous n'avez pas à passer des options.Références:
toLocaleString()
toLocaleDateString()
toLocaleString
/toLocaleDateString
... La méthodetoDateString
n'accepte pas tous les paramètres. developer.mozilla.org/de/docs/Web/JavaScript/Reference/...moment.js
pour un format simple. N'est heureusement un supplément de recherche de google et de trouver qu'il y a déjà des API natives de faire cela. Enregistré une dépendance externe. Génial!Intl.DateTimeFormat
classe.timeZoneName
option ne fonctionne pas sous IE (testé sous IE 11)undefined
comme le premier jeu de paramètre se sent arbitraire, vous pouvez au lieu de passer la valeur"default"
d'utiliser le navigateur, les paramètres régionaux, par MDN docs developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/...Utiliser le date.format de la bibliothèque:
retourne:
dateformat sur ngp
http://jsfiddle.net/phZr7/1/
require is not defined
Si vous avez besoin de mettre en forme rapidement votre date à l'aide de la plaine JavaScript, utilisez
getDate
,getMonth + 1
,getFullYear
,getHours
etgetMinutes
:Ou, si vous en avez besoin pour être des zéros:
toLocaleDateString()
peut format de la date en utilisant localisée mois/jour les noms..toString().padStart(2, '0')
("000" + d.getFullYear()).slice(-4)
String.padStart()
est disponible uniquement à partir de ECMAScript 2017.Bien, ce que je voulais, c'était de convertir la date d'aujourd'hui à un MySQL amical chaîne de date comme 2012-06-23, et pour utiliser la chaîne comme paramètre dans l'une de mes requêtes. La solution la plus simple que j'ai trouvé est: est-ce
Gardez à l'esprit que la solution ci-dessus ne pas prendre en compte le décalage horaire.
Vous pouvez envisager d'utiliser cette fonction à la place:
Cela vous donnera la date correcte dans le cas où vous êtes l'exécution de ce code au début/à la fin de la journée.
new Date(date + " UTC")
pour tromper le fuseau horaire, et vous pouvez éliminer les setMinutes ligne. L'homme, javascript est salevar today = new Date().toISOString().slice(0,-14)
🙂new Date().toISOString().split('T')[0]
new Intl.DateTimeFormat('en-ca-iso8601').format(new Date())
stackoverflow.com/questions/6348431/...new Date().toISOString().slice(0, 16).replace('T',' ')
tempsMise en forme personnalisée fonction:
Pour les formats, une fonction simple de faire le travail. L'exemple suivant génère l'international format AAAA-MM-JJ:
JS:
L'OP format peut être généré comme:
JS:
Remarque: Il est, cependant, généralement pas une bonne idée d'élargir le JavaScript bibliothèques standard (par exemple, par l'ajout de cette fonction est le prototype de la Date).
Plus avancés, la fonction pourrait générer configurable sortie sur la base d'un paramètre de format.
Si écrire une mise en forme de la fonction est trop long, il ya beaucoup de bibliothèques autour de qui fait. Certains autres réponses déjà les énumérer. Mais l'augmentation de dépendances est aussi contre-partie.
La norme ECMAScript fonctions de mise en forme:
Depuis les versions plus récentes de ECMAScript, le
Date
classe a certaines fonctions de mise en forme:Remarque: il est possible de générer de sortie personnalisé de ces formatage >
Exemples extraits:
JS:
new Date().toLocaleDateString()
vous donnemm/dd/yyyy
pasdd/mm/yyyy
merci de corriger ça.Si vous êtes déjà à l'aide de jQuery UI dans votre projet, vous pourriez faire de cette façon:
Certains datepicker format de la date options pour jouer avec sont disponibles ici.
querySelectorAll()
ne peut toujours pas le faire de manière fiable. Il est encore utilisé dans 70% des sites web, et toujours activement développé—il n'est pas encore mort. Et nous sommes pas encore à un point où nous pouvons nous appuyer sur des navigateurs JavaScript natif interprètes sans se sentir comme nos pantalons sont à tomber.Je pense que vous pouvez simplement utiliser le non-standard Date de la méthode
toLocaleFormat(formatString)
formatString: Une chaîne de format dans le format attendu par le
strftime()
fonction en C.Références:
new Intl.DateTimeFormat
semble être le remplacement de la developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/...Plaine de JavaScript est le meilleur choix pour les petites onetimers.
D'autre part, si vous avez besoin de plus de date de trucs, MomentJS est une excellente solution.
Par exemple:
Dans les navigateurs modernes (*), il vous suffit de faire ceci:
De sortie si elle est exécutée aujourd'hui (janvier 24ᵗʰ, 2016):
(*) Selon le MDN, "les navigateurs modernes" signifie Chrome 24+, Firefox 29+, Internet Explorer 11, Edge 12+, Opera 15+ & Safari nightly build.
Vous devriez jeter un oeil à date.js. Il ajoute beaucoup d'aides pour travailler avec des dates, par exemple, dans votre cas:
Prise en main: http://www.datejs.com/2007/11/27/getting-started-with-datejs/
@Sébastien -- alternative tout support de navigateur
De la Documentation:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString
new Date().toLocaleDateString("en-EN", {month: "short", weekday: "short", day: "2-digit", year: "numeric"})
retourne"Wed, Sep 06, 2017"
Je peux obtenir votre format demandé dans une ligne à l'aide de pas de bibliothèques et aucune Date n'méthodes de regex:
Mise à jour: Comme @RobG souligné, la sortie de Date.le prototype.toString() est dépendant de l'implémentation. Donc, à utiliser avec prudence et de modifier si nécessaire pour votre implémentations si vous utilisez cette solution. Dans mes tests, cela fonctionne de manière fiable en Amérique du Nord où les principaux navigateurs (Chrome, Safari, Firefox et IE) reviennent tous le même format de chaîne de caractères.
console.log(new Date().toString().replace(/\S+\s(\S+)\s(\d+)\s(\d+)\s.*/,'$2-$1-$3'));
À l'aide d'un ECMAScript Edition 6 (ES6/ES2015) modèle de chaîne:
Si vous avez besoin de changer les délimiteurs:
Ici, c'est un peu de code que je viens d'écrire à la poignée de la date de mise en forme pour un projet que je suis en train de travailler sur. Il imite le PHP le formatage de la date de fonctionnalités pour répondre à mes besoins. Se sentir libre de l'utiliser, c'est juste l'extension de l'existant Date() de l'objet. Cela peut ne pas être la solution la plus élégante, mais elle travaille pour mes besoins.
OK, nous avons quelque chose qui s'appelle Intl qui est très utile pour formater une date en JavaScript ces jours-ci:
Votre date comme ci-dessous:
Et que vous changez de Date à l'aide de new Date() comme ci-dessous:
Et maintenant vous pouvez les mettre en forme comme vous le souhaitez à l'aide d'une liste de locales comme ci-dessous:
Si vous voulez exactement le format que vous avez mentionné ci-dessus, vous pouvez faire:
Et le résultat va être:
Pour plus de détails sur ECMAScript l'Internationalisation de l'API (Intl), visite ici.
Solution Packagée: Luxon
Si vous souhaitez utiliser une solution adaptée à tous, je recommande fortement d'utiliser Luxon (une version modernisée de la Moment.js) qui fait aussi de la mise en forme dans de nombreux endroits/langues et des tonnes d'autres fonctionnalités.
Luxon est hébergé sur l'Moment.js site web et développé par une Moment.js développeur car Moment.js a des limites que le développeur a voulu répondre, mais ne le pouvait pas.
À installer:
npm install luxon
ouyarn add luxon
(visitez le lien pour les autres méthodes d'installation)Exemple:
luxon.DateTime.fromISO('2010-08-10').toFormat('yyyy-LLL-dd');
Rendements:
Solution Manuelle
De la même mise en forme que Moment.js, Classe DateTimeFormatter (Java), et La Classe SimpleDateFormat (Java), j'ai mis en place une solution complète
formatDate(date, patternStr)
où le code est facile à lire et à modifier. Vous pouvez afficher la date, l'heure, AM/PM, etc. Voir le code pour plus d'exemples.Exemple:
formatDate(new Date(), 'EEEE, MMMM d, yyyy HH:mm:ss:S')
(
formatDate
est mis en œuvre dans l'extrait de code ci-dessous)Rendements:
D'essayer le code en cliquant sur "Exécuter extrait de code."
Date et l'Heure de Modèles
yy
= 2 chiffres de l'année;yyyy
= année complèteM
= chiffre mois;MM
= 2 chiffres du mois;MMM
= nom du mois abrégé;MMMM
= nom complet du moisEEEE
= jour de la semaine, nom;EEE
= court du jour de la semained
= chiffre de la journée;dd
= 2-chiffres du jourh
= heures am/pm;hh
= 2 chiffres des heures am/pm;H
= heures;HH
= 2 chiffres des heuresm
= minutes;mm
= 2 chiffres minutes;aaa
= AM/PMs
= secondes;ss
= 2 chiffres secondesS
= millisecondesJS:
Merci @Gerry pour l'éducation de Luxon.
SimpleDateFormat
classe a été supplanté ans par lejava.time.format.DateTimeFormatter
classe.Si vous utilisez jQuery UI dans votre code, il y a une " fonction appelée
formatDate()
. Je suis l'aide de cette façon pour formater la date d'aujourd'hui:Vous pouvez voir de nombreux autres exemples de formatage de la date dans la documentation de jQuery UI.
Nous avons beaucoup de solutions, mais je pense que le meilleur d'entre eux est Moment.js. Donc, personnellement, je suggère l'utilisation de Moment.js pour la date et l'heure des opérations.
JS:
HTML:
Utile et flexible pour la mise en forme de la DateTimes en JavaScript est
Intl.DateTimeFormat
:Résultat Est:
"12-Oct-2017"
Les formats de date et heure peuvent être personnalisés à l'aide de l'argument options.
La
Intl.DateTimeFormat
objet est un constructeur pour les objets qui permettent à la langue de la date et de l'heure de mise en forme.Syntaxe
Paramètres
locales
En option. Une chaîne de caractères avec BCP 47 balise de langue, ou un tableau de chaînes. Pour la forme générale et l'interprétation des paramètres régionaux argument, voir l'Intl page. L'Unicode suivants clés d'extension sont autorisés:
Options
En option. Un objet avec certaines ou toutes les propriétés suivantes:
localeMatcher
Les paramètres régionaux correspondant à l'algorithme à utiliser. Les valeurs possibles sont
"lookup"
et"best fit"
; la valeur par défaut est"best fit"
. Pour plus d'informations sur cette option, voir la Intl page.fuseau horaire
Le fuseau horaire à utiliser. La seule valeur implémentations doivent reconnaître est
"UTC"
; la valeur par défaut est la durée du fuseau horaire par défaut. Les implémentations peuvent également reconnaître les noms de fuseau horaire de l'IANA fuseau horaire de base de données, tels que"Asia/Shanghai"
,"Asia/Kolkata"
,"America/New_York"
.12heures
De savoir si l'utilisation de 12 heures (au lieu de 24 heures). Les valeurs possibles sont
true
etfalse
; la valeur par défaut des paramètres régionaux dépendant.formatMatcher
Le format correspondant à l'algorithme à utiliser. Les valeurs possibles sont
"basic"
et"best fit"
; la valeur par défaut est"best fit"
. Voir les paragraphes suivants pour plus d'informations sur l'utilisation de cette propriété.Les propriétés suivantes décrivent la date-heure dans l'utilisation de composants au format de sortie et de leurs représentations. Les implémentations sont requises à l'appui d'au moins les sous-ensembles suivants:
Implémentations peuvent soutenir d'autres sous-ensembles, et les demandes seront négociés contre tous disponibles sous-représentation des combinaisons pour trouver la meilleure correspondance. Deux algorithmes sont disponibles pour cette négociation et sélectionnés par le formatMatcher propriété: Une entièrement spécifié
"basic"
et d'un algorithme de mise en œuvre dépend de "meilleur ajustement" de l'algorithme.jour de la semaine
La représentation du jour de la semaine. Les valeurs possibles sont
"narrow"
,"short"
,"long"
.ère
La représentation de l'époque. Les valeurs possibles sont
"narrow"
,"short"
,"long"
.année
La représentation de l'année. Les valeurs possibles sont
"numeric"
,"2-digit"
.mois
La représentation du mois. Les valeurs possibles sont
"numeric"
,"2-digit"
,"narrow"
,"short"
,"long"
.jour
La représentation de la journée. Les valeurs possibles sont
"numeric"
,"2-digit"
.heure
La représentation de l'heure. Les valeurs possibles sont
"numeric"
,"2-digit"
.minutes
La représentation de la minute. Les valeurs possibles sont
"numeric"
,"2-digit"
.deuxième
La représentation de la seconde. Les valeurs possibles sont
"numeric"
,"2-digit"
.timeZoneName
La représentation du temps, le nom de la zone. Les valeurs possibles sont
"short"
,"long"
.La valeur par défaut pour la date de chacun composant de la propriété n'est pas définie, mais si toutes les propriétés des composants ne sont pas définis, puis l'année, le mois et le jour sont supposés être
"numeric"
.Vérifiez En Ligne
Plus De Détails
Une solution d'activer JavaScript sans utiliser des bibliothèques externes:
C'est la façon dont je l'ai fait pour mon mnp plugins
March
deviendra3arch
avec ce code.'M'
àformat = format.replace("M(?!M)", (dt.getMonth()+1).toString());
et le mettre au-dessus de la ligne avec'MMMM'
JS:
Plus de documentation à developer.mozilla.org
Ce qui peut aider avec le problème:
JS:
d.toLocaleDateString('en-US', options);
si vous êtes aux etats-unis.Sugar.js a d'excellentes extensions à la Date de l'objet, y compris un Date.format méthode.
Exemples de la documentation:
Pour une quelconque recherche pour un de vraiment simple, ES6 solution pour copier, coller et à adopter:
JS:
Pour obtenir des "10-Août-2010", essayez:
Pour la prise en charge du navigateur, voir toLocaleDateString.
Ajouter le jQuery UI plugin à votre page:
Essayez ceci:
JS:
HTML:
DateFormatter.formatDate(new Date(2010,7,10), 'DD-MMM-YYYY')
=>
10-Aug-2010
DateFormatter.formatDate(new Date(), 'YYYY-MM-DD HH:mm:ss')
=>
2017-11-22 19:52:37
DateFormatter.formatDate(new Date(2005, 1, 2, 3, 4, 5), 'D DD DDD DDDD, M MM MMM MMMM, YY YYYY, h hh H HH, m mm, s ss, a A')
=>
2 02 Wed Wednesday, 2 02 Feb February, 05 2005, 3 03 3 03, 4 04, 5 05, am AM
JS:
Le format de description a été prise à partir de Ionique Cadre (il ne prend pas en charge
Z
, le Fuseau horaire UTC Offset)Si vous avez envie d'un court, lisible par l'homme, la fonction - c'est facilement réglable afin de s'adapter à vous.
La timeStamp paramètre est de quelques millisecondes à partir de 1970, il est renvoyé par
new Date().getTime()
et de nombreux autres appareils...OK, j'ai changé mon esprit. J'ai inclus une fonction supplémentaire pour zéro de remplissage. Malédictions!
Il y a une nouvelle bibliothèque, smarti.to.js, pour la mise en forme localisée de JavaScript, des nombres, des dates et JSON dates (Microsoft ou ISO8601).
Exemple:
Il y a aussi la coutume court modèles définis dans le fichier de localisation (smarti.d'.{culture}.js). Exemple (smarti.to.et-EE.js):
Et un multiformatting capacité:
Inspiré par JD Smiths'merveilleuse expression régulière solution, j'ai soudain eu cette tête de fractionnement idée:
Voici un script qui fait exactement ce que vous voulez
https://github.com/UziTech/js-date-format
Si vous êtes déjà à l'aide de ExtJS dans votre projet, vous pouvez utiliser Ext.Date:
retourne:
J'utilise la suite. Il est simple et fonctionne très bien.
Ou ceci:
C'est la principale réponse modifiée pour avoir un 3-char de mois et d'année à 2 chiffres:
JS:
Autre façon que vous pouvez le format de la date:
Utilisation:
Cela prend un JSON date/Date(1429573751663)/" et produit comme la chaîne mise en forme:
"4/21/2015"
Court, largement compatible approche:
Ou, sur une seule ligne:
2.39 KO minimisé. Un fichier. https://github.com/rhroyston/clock-js
10-Aug-2010:
str.charAt(0).toUpperCase() + str.slice(1,3);
un peu de défaites le but de l'utilisation d'une bibliothèque. Pourquoi ne pas ajouter des out-of-the-box " pour trois lettre du mois de formats? Aussi, vous pouvez envisager l'ajout de l'internationalisation à vous de la bibliothèque, comme une bibliothèque comme celle-ci serait un peu inutile pour les non-sites en anglais sans elle!Le code suivant va vous permettre de format de date
DD-MM-YYYY
(27-12-2017) ouDD MMM YYYY
(27 Décembre 2017) :Modifier l'ordre de
date.getFullYear()
etpadNumber(date.getDate(), '0', 1)
de faire undateToYMD()
fonction.Voir repl.c'exemple pour plus de détails.
Je sais que quelqu'un pourrait dire que c'est stupide de solution, mais il fait le tour en supprimant les informations inutiles à partir de la date de chaîne.
yourDateObject
produit:Wed Dec 13 2017 20:40:40 GMT+0200 (EET)
yourDateObject.toString().slice(0, 15);
produit:Wed Dec 13 2017
Vous n'avez pas besoin de toutes les bibliothèques. Il suffit d'extraire la date de composants et de construire la chaîne. Voici comment obtenir
YYYY-MM-DD
format. Notez également le mois de l'indice "janvier est 0, le mois de février est 1, et ainsi de suite."Une simple fonction qui permet de retourner la date, la date + heure, ou juste le temps:
Ce Module peut facilement traiter la plupart des tous les cas, il est.
Il fait partie d'un plus grand mnp, par Locutus, qui comprend une variété de fonctions, mais peut être utilisée de façon totalement indépendante de l'emballage lui-même, il suffit de copier coller/adapter un peu si vous ne travaillez pas avec npm (changement de module pour qu'une fonction)
Comme deuxième paramètre, il accepte un timestamp, qui peuvent venir de n'importe où, comme sa Date.getTime()
Aussi, Locutus maintient un plus grand module datetime, également à l'intérieur de la locutus package qui va donner un plus orienté-objet, utiliser le
Ici vous pouvez voir d'autres fonctions date et heure, sous forme de modules, qui s'est avéré être très utile aussi.
Vous pouvez trouver de la documentation sur les paramètres et les chaînes de format ici (à noter que la doc est un site php site, mais le locutus mise en œuvre suit exactement les mêmes caractéristiques)
Exemples de date Module
Cette bibliothèque peut format de l'objet de date et d'analyser la chaîne mise en forme de retour de l'objet Date.
Il utilise Java format (classe SimpleDateFormat). Le nom des mois et des jours peut être localisé.
http://www.javascriptsource.com/repository/javascripts/2009/03/880961/JS_Simple_Date_Format.zip
Exemple:
format()
est pas une méthode deDate
objets et le code ci-dessus ne fonctionnera pas, sauf si vous avez ajouté un peu de mise en œuvre deformat()
àDate.prototype
. Sans en offrant une telle mise en œuvre, cette réponse est sans valeur.