4 packages pour travailler avec la date et l'heure en JavaScript

La prise en charge intégrée de JavaScript pour la gestion des dates est utile, mais elle peut être difficile à utiliser. Les opérations complexes telles que les conversions de fuseau horaire et le formatage de la date sont souvent difficiles.

Heureusement, plusieurs packages sont disponibles pour rendre le travail avec les dates et les heures en JavaScript moins stressant. Ici, vous découvrirez certains de ces packages et comment vous pouvez commencer à travailler sur ces packages.

Lorsqu'il s'agit de travailler avec des dates et des heures, l'objet Date JavaScript natif a des fonctionnalités limitées.

Moment.js, une bibliothèque JavaScript, a introduit de nombreuses fonctionnalités non disponibles dans l'objet Date natif. En conséquence, c'est devenu la bibliothèque incontournable pour travailler avec les dates et les heures.

Pour installer Moment.js avec npm, exécutez la commande suivante depuis le répertoire de votre projet :

npm installer moment

Après l'installation, vous pouvez importer Moment.js dans votre projet et effectuer des opérations avec la bibliothèque :

constante moment = exiger('moment');
constante maintenant = instant();
constante maintenantString = maintenant.format('AAAA-MM-JJ HH: mm: ss');
console.enregistrer(`La date et l'heure actuelles sont ${nowString}`);

Cet extrait de code importe la bibliothèque Moment.js et crée un objet moment en utilisant la date et l'heure actuelles avec le moment() fonction. Il montre ensuite comment formater l'objet de date créé sous forme de chaîne avec le format() méthode, qui prend un format date/heure comme argument.

Vous pouvez également utiliser cette bibliothèque pour ajouter et soustraire des intervalles de temps :

constante addTenMinutes = moment().add(10, 'minutes');
console.enregistrer(`${addTenMinutes.format('h: mm un')}`);
constante subtractTwoDays = moment().subtract(2, 'jours');
console.enregistrer(`${subtractTwoDays.format('jjjj, MMMM Faire AAAA')}`);

Le programme enregistre deux variables dans la console, dans des formats différents. La première, addTenMinutes, contient le résultat de l'ajout de 10 minutes à la date et à l'heure actuelles. La deuxième, soustraireDeuxJours, a la date et l'heure actuelles avec deux jours soustraits.

Moment.js peut effectuer d'autres opérations comme la vérification des années bissextiles et la conversion d'un format de date à un autre.

Il est important de noter que Moment.js n'est plus maintenu par son équipe de développeurs principale. Les développeurs conseillent d'utiliser une alternative comme Luxon.js.

Luxon.js est une bibliothèque JavaScript robuste et plus moderne pour travailler avec des dates. Une alternative à Moment.js, il répond aux limitations de l'ancienne bibliothèque comme la mutabilité.

Vous pouvez installer Luxon avec npm puis importer son DateHeure classe dans votre projet Node.js à l'aide de la exiger() fonction:

constante { DateHeure } = exiger('luxon');

Dans Luxon, les objets DateTime font référence à des instances de temps qui descendent jusqu'aux millisecondes.

Vous pouvez créer de nouveaux DateHeure objets et accéder à leurs composants, comme l'année, le mois, la minute et la seconde :

constante maintenant = DateHeure.maintenant();
constante année = maintenant.année ;
constante minute = maintenant.minute;
constante seconde = maintenant.seconde ;

Ce code crée un nouveau DateHeure objet représentant la date et l'heure actuelles à l'aide de la maintenant() méthode. Il accède ensuite aux composants de cette date à l'aide de la année, minute, et deuxième propriétés.

Une différence majeure entre Luxon.js et Moment.js est son caractère immuable. Tous les objets DateTime sont immuables dans Luxon, ce qui signifie que vous ne pouvez pas modifier les propriétés DateTime. Au lieu de cela, vous pouvez créer de nouvelles instances DateTime à partir d'instances existantes.

Par exemple:

constante maintenant = DateHeure.maintenant();
constante demain = maintenant.plus({ jours: 1 });

Ce code crée un nouveau DateHeure objet nommé demain basé sur maintenant objet, à l'aide de plus méthode, en lui passant une valeur de 1 jour comme argument. La méthode plus crée un nouvel objet DateTime avec le nombre de jours spécifié ajouté à l'objet d'origine.

Un autre avantage de Luxon.js est sa prise en charge fiable du fuseau horaire, qui est essentielle pour travailler avec les dates et les heures dans les applications Web modernes. La bibliothèque utilise l'API d'internationalisation dans les navigateurs modernes pour fournir une prise en charge précise du fuseau horaire.

Cependant, l'un des inconvénients de Luxon.js est ses ressources communautaires limitées.

Date-fns est une bibliothèque JavaScript très légère conçue pour travailler avec des dates et des heures. Il s'appuie sur l'objet JavaScript natif.

Date-fns utilise techniques de programmation fonctionnelle et intègre une fonctionnalité immuable, qui simplifie le travail avec les dates et réduit la probabilité de bogues dans votre code.

Après avoir installé date-fns avec npm, importez le package dans votre programme à l'aide de la fonction require :

constante { format, ajouterJours } = exiger('date-fns');

Date-fns est modulaire. Il contient de nombreuses fonctions auxquelles vous pouvez accéder en déstructurant le package, comme indiqué dans le bloc de code ci-dessus. Le code importe uniquement les fonctions format et addDays de la bibliothèque date-fns.

Voici un exemple d'utilisation de ces deux fonctions :

constante aujourd'hui = nouveauDate();
constante formattedDate = format (aujourd'hui, 'aaaa-MM-jj');
console.log (date formatée); 
constante demain = format (addDays (aujourd'hui, 1), 'aaaa-MM-jj');
console.log (demain);

Ce programme illustre l'utilisation de la bibliothèque date-fns en JavaScript pour formater et manipuler les dates.

Il crée un nouveau Date objet représentant la date courante. Il formate la date actuelle en utilisant le format fonction de la bibliothèque date-fns.

Il utilise alors le ajouterJours pour créer un nouvel objet Date représentant la date de demain, le formate à l'aide de la format fonction, et enregistre à la fois la date actuelle et la date de demain sur la console dans "aaaa-MM-jjformat ".

Un inconvénient de l'utilisation de Date-fns est qu'il ne prend pas en charge le fuseau horaire. Au lieu de cela, il utilise une bibliothèque distincte pour travailler avec les fuseaux horaires à l'aide de fonctions d'assistance.

Day.js, une autre bibliothèque très légère, est un bon choix si vous recherchez une alternative immuable, plus petite et plus rapide à Moment.js.

Vous pouvez installer Day.js en tant que package dans votre projet JavaScript en exécutant la commande npm suivante :

npm installer jourjs

Pour importer Day.js dans votre projet après l'installation, vous pouvez utiliser le code suivant :

constante jourjs = exiger('dayjs')

Voici quelques fonctions et méthodes de base disponibles dans Day.js

constante maintenant = jourjs();
constante date = jourjs('2023-03-23', 'AAAA-MM-JJ');
constante mois = date.mois();
constante formattedDate = date.format('MMMM J, AAAA');
constante semainesuivante = date.add(1, 'semaine');

Le code ci-dessus crée un nouvel objet Day.js représentant la date et l'heure actuelles, analyse une chaîne de date avec un format personnalisé et obtient le mois à partir du date variable. Il montre également comment formater et ajouter à une instance de date.

Comme Date-fns, Day.js ne peut pas fournir de support de fuseau horaire par lui-même. Day.js utilise un système de plugin, ce qui rend son utilisation déroutante.

Parmi les packages couverts, Day.js est le plus similaire à Moment.js. Cela facilite le basculement entre les deux si vous en avez besoin.

Choisir la bonne bibliothèque pour votre application

Choisir la bonne bibliothèque de date et d'heure pour votre application JavaScript est une décision importante qui peut avoir un impact important sur la qualité et la maintenabilité de votre code.

Chacune des bibliothèques discutées ici a ses forces et ses faiblesses, il est donc important d'évaluer soigneusement vos besoins avant de prendre une décision.