Comment afficher la date et l'heure UTC en français en JavaScript ?

Réponses rédigées par Antoine
Dernière mise à jour : 2022-04-07 11:24:18
Thèmes : javascript - date - heure - utc
Question

En JavaScript, comment faire pour afficher la date et l'heure UTC, en français, au format suivant :

Jeudi 07 Avril 2022 09:22:52 UTC

Réponse

Habituellement on utilise la fonction JavaScript toLocaleDateString avec ses options pour afficher la date en français, cela évite de lister dans un array le nom des jours et des mois en français.

Il n'existe pas de fonction native toLocaleUTCDateString. Donc à défaut d'utiliser les fonctions getUTCDay, getUTCMonth et getUTCYear, on peut créer une fonction toLocaleUTCDateString pour profiter des options de la fonction toLocaleDateString.

Pour l'heure, on peut utiliser les fonctions JavaScript getUTCHours(), getUTCMinutes() et getUTCSeconds(), avec la fonction slice(), pour ajouter un zéro permanent non significatif.

On a aussi besoin d'une expression régulière pour mettre les premières lettres des jours et des mois en majuscules.

Voici comment afficher la date et l'heure UTC en français en JavaScript :

<!DOCTYPE html> 
<html> 
<head>
<meta charset="UTF-8">
<title>Comment afficher la date et l'heure UTC en français en JavaScript ?</title>
</head>
<body>
<script>
function toLocaleUTCDateString(date, locales, options) {
const tempsDiff = date.getTimezoneOffset() * 60000;
const ajustementDate = new Date(date.valueOf() + tempsDiff);
return ajustementDate.toLocaleDateString(locales, options);
}
var cejour = new Date();
var options = {weekday: "long", year: "numeric", month: "long", day: "2-digit"};
var date = toLocaleUTCDateString(cejour, "fr-FR", options);
var heure = ("0" + cejour.getUTCHours()).slice(-2) + ":" + ("0" + cejour.getUTCMinutes()).slice(-2) + ":" + ("0" + cejour.getUTCSeconds()).slice(-2);
var dateheure = date + " " + heure + " UTC";
var dateheure = dateheure.replace(/(^\w{1})|(\s+\w{1})/g, lettre => lettre.toUpperCase());
alert(dateheure);
</script>
</body>
</html>