Travailler avec les dates en TypeScript : aperçu des bibliothèques date-fns, Luxon et Day.js

Travailler avec les dates en TypeScript : aperçu des meilleures bibliothèques

TypeScript, étant une surcouche strictement typée de JavaScript, hérite de tous les problèmes de gestion des dates propres au Date natif — une API non intuitive, la mutabilité, les problèmes de fuseaux horaires et d'analyse. Heureusement, l'écosystème TypeScript propose plusieurs bibliothèques puissantes qui résolvent ces problèmes. Dans cet article, nous examinerons les trois outils les plus populaires : date-fns, Luxon et Day.js, comparerons leurs fonctionnalités et fournirons des exemples de code pratiques.

1. date-fns — modulaire et fonctionnelle

date-fns est une bibliothèque construite sur les principes de la programmation fonctionnelle. Elle se compose de nombreuses fonctions indépendantes, ce qui permet d'importer uniquement ce dont vous avez besoin et de ne pas alourdir le bundle. Elle fonctionne avec les objets natifs Date, ce qui simplifie l'intégration.

Caractéristiques clés :

• Fonctions pures : chaque fonction retourne un nouvel objet sans modifier l'original.
• Modularité : importez uniquement les fonctions nécessaires (par exemple, import { format, addDays } from 'date-fns').
• Support des locales : prise en charge intégrée de plus de 50 langues, dont le français.
• TypeScript : excellente typification prête à l'emploi.

Exemples de code avec date-fns

Installation :

npm install date-fns

Formatage de la date :

import { format } from 'date-fns';import { fr } from 'date-fns/locale';

const date = new Date(2024, 11, 25); // 25 décembre 2024const formatted = format(date, 'dd MMMM yyyy', { locale: fr });console.log(formatted); // "25 décembre 2024"

Manipulations de dates :

import { addDays, subMonths, differenceInDays } from 'date-fns';

const today = new Date();const future = addDays(today, 10);const past = subMonths(today, 3);const diff = differenceInDays(future, past);console.log(`Différence : ${diff} jours`);

Comparaison de dates :

import { isBefore, isAfter, isEqual } from 'date-fns';

const date1 = new Date(2024, 0, 1);const date2 = new Date(2024, 6, 1);console.log(isBefore(date1, date2)); // true

2. Luxon — puissante et moderne

Luxon est une bibliothèque créée par l'un des auteurs de Moment.js pour résoudre ses lacunes. Luxon utilise ses propres objets immuables (DateTime, Duration) plutôt que le Date natif. Cela la rend particulièrement pratique pour travailler avec les fuseaux horaires et les intervalles.

Caractéristiques clés :

• Immutabilité : toutes les méthodes retournent de nouvelles instances.
• Support intégré des fuseaux horaires : sans plugins supplémentaires.
• Internationalisation : localisation basée sur l'API Intl.
• Travail avec les intervalles et les durées : méthodes pratiques pour calculer les périodes de temps.

Exemples de code avec Luxon

Installation :

npm install luxon

Création et formatage de la date :

import { DateTime } from 'luxon';

const dt = DateTime.fromISO('2024-12-25', { zone: 'Europe/Paris' });console.log(dt.toFormat('dd.MM.yyyy HH:mm')); // "25.12.2024 00:00"

// Sortie localiséeconsole.log(dt.setLocale('fr').toFormat('d MMMM yyyy')); // "25 décembre 2024"

Travail avec les fuseaux horaires :

const nyTime = DateTime.now().setZone('America/New_York');const parisTime = nyTime.setZone('Europe/Paris');console.log(`À New York : ${nyTime.toFormat('HH:mm')}, à Paris : ${parisTime.toFormat('HH:mm')}`);

Durées et intervalles :

import { Duration, Interval } from 'luxon';

const dur = Duration