JavaScript Formatage d'une date JavaScript


Exemple

Formater une date JavaScript dans les navigateurs modernes

Dans les navigateurs modernes (*), Date.prototype.toLocaleDateString() vous permet de définir le formatage d'une Date de manière pratique.

Il nécessite le format suivant:

dateObj.toLocaleDateString([locales [, options]])

Le paramètre locales doit être une chaîne avec une balise de langage BCP 47 ou un tableau de ces chaînes.

Le paramètre options doit être un objet avec certaines ou toutes les propriétés suivantes:

  • localeMatcher : les valeurs possibles sont "lookup" et "best fit" ; la valeur par défaut est "best fit"
  • timeZone : les seules implémentations de valeur doivent être "UTC" ; la valeur par défaut est le fuseau horaire par défaut de l'exécution
  • hour12 : les valeurs possibles sont true et false ; la valeur par défaut dépend de la localisation
  • formatMatcher : les valeurs possibles sont "basic" et "best fit" ; la valeur par défaut est "best fit"
  • jour de la semaine : les valeurs possibles sont "narrow" , "short" et "long"
  • era : les valeurs possibles sont "narrow" , "short" et "long"
  • année : les valeurs possibles sont "numeric" et "2-digit"
  • month : les valeurs possibles sont "numeric" , "2-digit" , "narrow" , "short" et "long"
  • jour : les valeurs possibles sont "numeric" et "2-digit"
  • heure : les valeurs possibles sont "numeric" et "2-digit"
  • minute : les valeurs possibles sont "numeric" et "2-digit"
  • seconde : les valeurs possibles sont "numeric" et "2-digit"
  • timeZoneName : les valeurs possibles sont "short" & "long"

Comment utiliser

var today = new Date().toLocaleDateString('en-GB', {  
    day : 'numeric',
    month : 'short',
    year : 'numeric'
});

Sortie si exécutée le 24 janvier 2036:

'24 Jan 2036'

Aller à la coutume

Si Date.prototype.toLocaleDateString() n'est pas assez flexible pour répondre à vos besoins, vous pouvez envisager de créer un objet Date personnalisé qui ressemble à ceci:

var DateObject = (function() {
    var monthNames = [
      "January", "February", "March",
      "April", "May", "June", "July",
      "August", "September", "October",
      "November", "December"
    ];
    var date = function(str) {
        this.set(str);
    };
    date.prototype = {
        set : function(str) {
            var dateDef = str ? new Date(str) : new Date();
            this.day = dateDef.getDate();
            this.dayPadded = (this.day < 10) ? ("0" + this.day) : "" + this.day;
            this.month = dateDef.getMonth() + 1;
            this.monthPadded = (this.month < 10) ? ("0" + this.month) : "" + this.month;
            this.monthName = monthNames[this.month - 1];
            this.year = dateDef.getFullYear();
        },
        get : function(properties, separator) {
            var separator = separator ? separator : '-'
                ret = [];
            for(var i in properties) {
                ret.push(this[properties[i]]);
            }
            return ret.join(separator);
        }
    };
    return date;
})();

Si vous avez inclus ce code et exécuté new DateObject() le 20 janvier 2019, il produirait un objet avec les propriétés suivantes:

day: 20
dayPadded: "20"
month: 1
monthPadded: "01"
monthName: "January"
year: 2019

Pour obtenir une chaîne formatée, vous pouvez faire quelque chose comme ceci:

new DateObject().get(['dayPadded', 'monthPadded', 'year']);

Cela produirait la sortie suivante:

20-01-2016

(*) Selon le MDN , "navigateurs modernes" signifie Chrome 24+, Firefox 29+, IE11, Edge12 +, Opera 15+ et Safari nightly build