JavaScript - Formats de date : Guide du débutant

Bonjour à tous, développeurs JavaScript en herbe ! Aujourd'hui, nous allons plonger dans le monde fascinant des formats de date en JavaScript. Ne vous inquiétez pas si vous n'avez jamais écrit une ligne de code auparavant - je serai votre guide bienveillant tout au long de ce voyage, tout comme j'ai été pour des centaines d'étudiants au fil des ans. Alors, prenez une tasse de café (ou de thé, si c'est votre truc), et c'est parti !

JavaScript - Date Formats

Qu'est-ce que les formats de date ?

Avant de nous plonger dans le code, parlons de ce que sont réellement les formats de date. Pensez-y comme des manières différentes de représenter un moment précis dans le temps.Tout comme vous pourriez dire "1er avril 2023" ou "1/4/23" pour signifier la même date, les ordinateurs ont également diverses manières d'exprimer les dates.

En JavaScript, nous avons un objet intégré Date qui nous aide à travailler avec les dates et les heures. C'est comme avoir un super-calendrier directement dans notre code !

Formats de date courants en JavaScript

Voyons quelques-uns des formats de date les plus courants que vous rencontrerez :

1. Format ISO

C'est le format standard utilisé internationalement. Il ressemble à ceci : "AAAA-MM-JJ".

let today = new Date();
console.log(today.toISOString().split('T')[0]);

Dans cet exemple, new Date() crée un objet date pour la date et l'heure actuelle. Nous le convertissons ensuite en format ISO et le coupons pour obtenir uniquement la partie date. Si vous exécutez ceci le 1er avril 2023, vous verrez : "2023-04-01".

2. Format de date court

Ce format est plus compact : "MM/JJ/AAAA".

let today = new Date();
console.log(today.toLocaleDateString('en-US'));

Cela affichera quelque chose comme "4/1/2023" pour le 1er avril 2023.

3. Format de date long

Ce format écrit le mois en lettres : "Mois JJ, AAAA".

let today = new Date();
console.log(today.toLocaleDateString('en-US', { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }));

Cela vous donnera quelque chose comme "Samedi, 1er avril 2023".

Création d'objets Date

Maintenant que nous avons vu quelques formats, examinons les différentes manières de créer des objets date :

1. Date et heure actuelle

let now = new Date();
console.log(now);

Cela crée un objet date pour le moment actuel.

2. Date et heure spécifiques

let birthday = new Date('1990-05-15T13:30:00');
console.log(birthday);

Cela crée un objet date pour le 15 mai 1990 à 13h30.

3. Utilisation de composants individuels

let christmas = new Date(2023, 11, 25); // Note : le mois est indexé à 0
console.log(christmas);

Cela crée un objet date pour le 25 décembre 2023 (souvenez-vous, en JavaScript, les mois sont indexés à zéro, donc 11 représente décembre).

Travailler avec les dates

Maintenant que nous savons comment créer des dates, examinons quelques opérations courantes :

1. Obtention des composants d'une date

let today = new Date();
console.log("Année :", today.getFullYear());
console.log("Mois :", today.getMonth() + 1); // +1 car les mois sont indexés à 0
console.log("Jour :", today.getDate());
console.log("Heure :", today.getHours());
console.log("Minute :", today.getMinutes());
console.log("Seconde :", today.getSeconds());

Cela affichera chaque composant de la date et de l'heure actuelle.

2. Formatage des dates

JavaScript propose plusieurs méthodes pour formater les dates :

let date = new Date('2023-04-01T12:00:00');

console.log(date.toDateString()); // "Sat Apr 01 2023"
console.log(date.toTimeString()); // "12:00:00 GMT+0000 (Coordinated Universal Time)"
console.log(date.toLocaleString()); // "4/1/2023, 12:00:00 PM"
console.log(date.toLocaleDateString()); // "4/1/2023"
console.log(date.toLocaleTimeString()); // "12:00:00 PM"

Chacune de ces méthodes vous donne une représentation différente de la même date.

Table des méthodes Date

Voici un tableau pratique des méthodes courantes de l'objet Date :

Méthode Description Exemple
getFullYear() Obtient l'année (4 chiffres) date.getFullYear() // 2023
getMonth() Obtient le mois (0-11) date.getMonth() // 3 (pour avril)
getDate() Obtient le jour du mois (1-31) date.getDate() // 1
getDay() Obtient le jour de la semaine (0-6) date.getDay() // 6 (pour samedi)
getHours() Obtient l'heure (0-23) date.getHours() // 12
getMinutes() Obtient les minutes (0-59) date.getMinutes() // 0
getSeconds() Obtient les secondes (0-59) date.getSeconds() // 0
toDateString() Convertit la date en une chaîne lisible date.toDateString() // "Sat Apr 01 2023"
toTimeString() Convertit l'heure en une chaîne lisible date.toTimeString() // "12:00:00 GMT+0000 (Coordinated Universal Time)"

Conclusion

Et voilà, les amis ! Nous avons parcouru le pays des formats de date JavaScript, de la création d'objets date à leur formatage en diverses manières. Souvenez-vous, travailler avec les dates peut sembler délicat au début, mais avec de la pratique, vous les manipulerez comme un pro en un rien de temps.

Comme je le dis toujours à mes étudiants, la clé pour maîtriser les concepts de programmation est d'expérimenter. Essayez ces exemples, modifiez-les, et voyez ce qui se passe. N'ayez pas peur de faire des erreurs - c'est souvent là que se produit le meilleur apprentissage !

Continuez à coder, continuez à apprendre, et surtout, amusez-vous avec ça. Avant de vous en rendre compte, vous serez celui qui explique les formats de date à vos amis (que ce soit ce qu'ils veulent entendre ou non) !

Credits: Image by storyset