TypeScript - Objet Date : Un guide pour les débutants

Salut là, future super star du codage ! Aujourd'hui, nous allons entreprendre un voyage passionnant à travers le monde des dates dans TypeScript. Ne t'inquiète pas si tu n'as jamais écrit une ligne de code auparavant - je serai ton guide amical, et nous avancerons pas à pas. À la fin de ce tutoriel, tu manipuleras les dates comme un pro !

Qu'est-ce qu'un Objet Date ?

Avant de plonger dans les détails, parlons de ce qu'est réellement un objet Date. En TypeScript (et JavaScript), un objet Date représente un seul moment dans le temps. C'est comme un instantané d'une date et heure spécifique, que nous pouvons manipuler et utiliser dans nos programmes.

Pense-y comme une horloge digitale que tu peux régler à n'importe quel moment, passé, présent ou futur. Génial, non ?

Syntaxe : Créer un Objet Date

Maintenant, regardons comment nous pouvons créer un objet Date dans TypeScript. Il y a plusieurs façons de faire cela, et je te montrerai chacune avec des exemples.

1. Date et Heure Actuelle

Pour créer un objet Date avec la date et l'heure actuelle, tu utilises simplement le constructeur new Date() sans aucun argument.

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

Si tu exécutes ce code, tu verras quelque chose comme :

2023-06-15T12:30:45.678Z

Ça peut sembler un peu intimidant, mais ne t'inquiète pas ! C'est juste l'affichage de la date et l'heure actuelle dans un format standardisé.

2. Date et Heure Spécifiques

Tu peux aussi créer un objet Date pour une date et une heure spécifiques. Il y a plusieurs façons de faire cela :

a. Utiliser une chaîne de date

let christmas = new Date("December 25, 2023 00:00:00");
console.log(christmas);

Cela affichera :

2023-12-25T00:00:00.000Z

b. Utiliser des paramètres séparés

let newYear = new Date(2024, 0, 1, 0, 0, 0);
console.log(newYear);

Cela affichera :

2024-01-01T00:00:00.000Z

Note que le mois est 0 pour janvier. En JavaScript et TypeScript, les mois sont indexés à partir de zéro, ce qui signifie que janvier est 0, février est 1, et ainsi de suite. C'est une particularité qui prend souvent les débutants par surprise, donc souviens-toi-en !

c. Utiliser les millisecondes depuis l'époque

Tu peux aussi créer une date en spécifiant le nombre de millisecondes depuis le 1er janvier 1970 (connu sous le nom d'"époque") :

let someDate = new Date(1687012345678);
console.log(someDate);

Cela affichera une date et une heure correspondant à ce nombre de millisecondes après l'époque.

Travailler avec des Objets Date

Maintenant que nous savons comment créer des objets Date, regardons quelques-unes des choses que nous pouvons faire avec eux.

Obtenir des Composants de Date

Les objets Date ont plusieurs méthodes pour obtenir différents composants de la date :

let today = new Date();

console.log("Année entière:", today.getFullYear());
console.log("Mois:", today.getMonth());
console.log("Date:", today.getDate());
console.log("Jour:", today.getDay());
console.log("Heures:", today.getHours());
console.log("Minutes:", today.getMinutes());
console.log("Secondes:", today.getSeconds());

Cela pourrait afficher quelque chose comme :

Année entière: 2023
Mois: 5
Date: 15
Jour: 4
Heures: 12
Minutes: 45
Secondes: 30

Souviens-toi, getMonth() renvoie un mois indexé à partir de zéro, donc 5 signifie juin !

Définir des Composants de Date

Tout comme nous pouvons obtenir des composants de date, nous pouvons également les définir :

let futureDate = new Date();

futureDate.setFullYear(2025);
futureDate.setMonth(11);  // Décembre
futureDate.setDate(31);
futureDate.setHours(23);
futureDate.setMinutes(59);
futureDate.setSeconds(59);

console.log(futureDate);

Cela définira la date sur décembre 31, 2025, à 23:59:59.

Formater les Dates

TypeScript (et JavaScript) fournissent quelques méthodes intégrées pour formater les dates :

let event = new Date("July 4, 2023 12:00:00");

console.log(event.toDateString());
console.log(event.toTimeString());
console.log(event.toLocaleDateString());
console.log(event.toLocaleTimeString());
console.log(event.toISOString());

Cela affichera :

Mar Jul 04 2023
12:00:00 GMT+0000 (Temps Universel Coordonné)
7/4/2023
12:00:00 PM
2023-07-04T12:00:00.000Z

Arithmetic avec les Dates

Une des choses les plus géniales à propos des objets Date, c'est qu'on peut faire des opérations mathématiques avec eux ! Regardons quelques exemples :

Ajouter des Jours

let today = new Date();
let nextWeek = new Date(today.getTime() + 7 * 24 * 60 * 60 * 1000);

console.log("Aujourd'hui:", today);
console.log("Lundi prochain:", nextWeek);

Cela ajoute 7 jours à la date actuelle. Nous multiplions 7 (jours) par 24 (heures) par 60 (minutes) par 60 (secondes) par 1000 (millisecondes) pour obtenir le nombre de millisecondes dans une semaine.

Soustraire des Dates

Nous pouvons aussi trouver la différence entre deux dates :

let start = new Date("March 1, 2023");
let end = new Date("June 15, 2023");

let difference = end.getTime() - start.getTime();
let days = Math.floor(difference / (24 * 60 * 60 * 1000));

console.log(`Il y a ${days} jours entre ${start.toDateString()} et ${end.toDateString()}`);

Cela calculera le nombre de jours entre le 1er mars 2023 et le 15 juin 2023.

Conclusion

Félicitations ! Tu viens de faire tes premiers pas dans le monde des objets Date en TypeScript. Nous avons couvert la création de dates, l'obtention et la définition des composants de date, le formatage des dates, et même un peu d'arithmétique avec les dates.

Souviens-toi, travailler avec les dates peut parfois être délicat, surtout lorsqu'on traite des fuseaux horaires ou des heures d'été. Mais avec de la pratique, tu deviendras plus à l'aise et plus compétent.

Voici un tableau récapitulatif des principales méthodes que nous avons couvertes :

Méthode	Description
new Date()	Crée un nouvel objet Date
getFullYear()	Obtient l'année (4 chiffres)
getMonth()	Obtient le mois (0-11)
getDate()	Obtient le jour du mois (1-31)
getDay()	Obtient le jour de la semaine (0-6)
getHours()	Obtient l'heure (0-23)
getMinutes()	Obtient les minutes (0-59)
getSeconds()	Obtient les secondes (0-59)
setFullYear()	Définit l'année
setMonth()	Définit le mois
setDate()	Définit le jour du mois
setHours()	Définit l'heure
setMinutes()	Définit les minutes
setSeconds()	Définit les secondes
toDateString()	Retourne la partie date sous forme de chaîne lisible par un humain
toTimeString()	Retourne la partie heure sous forme de chaîne lisible par un humain
toLocaleDateString()	Retourne la partie date en utilisant les conventions locales
toLocaleTimeString()	Retourne la partie heure en utilisant les conventions locales
toISOString()	Retourne la date au format ISO

Continue à pratiquer, à coder, et surtout, amuse-toi ! Le monde de la programmation est rempli de possibilités passionnantes, et maîtriser les dates n'est que le début. Bon codage !

Credits: Image by storyset