Bac à sable Moment.js

Qu’est‑ce que Moment.js ?

Moment.js est une bibliothèque JavaScript largement utilisée pour analyser, valider, manipuler et formater les dates. Avant l’apparition d’alternatives modernes, Moment.js était la référence de facto pour la gestion des dates dans les applications JavaScript. Elle fournit une API claire et chaînable qui rend le travail avec les dates intuitif et simple. Bien que des bibliothèques plus récentes comme date-fns et Luxon existent, Moment.js reste très utilisé dans les bases de code héritées et continue d’être maintenu activement pour les corrections de bugs. Comprendre Moment.js est essentiel pour les développeurs travaillant sur des projets existants qui en dépendent.

Pourquoi utiliser une bibliothèque de manipulation de dates ?

L’objet natif Date de JavaScript est notoirement difficile à manipuler. Il présente un comportement incohérent selon les navigateurs, un indexage des mois déroutant (0‑11 au lieu de 1‑12), des options de formatage limitées et aucune prise en charge native des fuseaux horaires. Les bibliothèques de dates comme Moment.js résolvent ces problèmes en offrant une API cohérente et bien documentée. Elles gèrent automatiquement les cas limites tels que les transitions d’heure d’été, les années bissextiles et le formatage spécifique à chaque locale, évitant aux développeurs d’écrire une logique de date sujette aux erreurs à partir de zéro.

Description de l’outil

Le Moment.js Playground est un environnement interactif basé sur le navigateur pour expérimenter avec la bibliothèque Moment.js. Écrivez et exécutez du code JavaScript directement dans l’éditeur avec un accès complet à Moment.js et Moment Timezone. Le playground exécute automatiquement votre code au fur et à mesure que vous tapez (avec dé‑bouncing) et affiche toute la sortie console dans un panneau de type terminal en dessous. C’est idéal pour apprendre Moment.js, tester des chaînes de format de date, déboguer des calculs de date et prototyper des logiques liées au temps sans installer d’environnement de développement.

Exemples

Formater la date actuelle :

const now = moment();
console.log(now.format("MMMM Do, YYYY"));
// Output: December 30th, 2025

console.log(now.format("dddd, h:mm A"));
// Output: Monday, 3:45 PM

Analyser différents formats de date :

const date1 = moment("2025-12-25", "YYYY-MM-DD");
const date2 = moment("25/12/2025", "DD/MM/YYYY");
const date3 = moment("Dec 25, 2025", "MMM D, YYYY");

console.log(date1.format("dddd")); // Thursday
console.log(date2.isValid()); // true
console.log(date3.month()); // 11 (0-indexed)

Calculer le temps relatif :

const past = moment().subtract(3, "days");
const future = moment().add(2, "weeks");

console.log(past.fromNow()); // 3 days ago
console.log(future.fromNow()); // in 14 days
console.log(past.from(future)); // 17 days ago

Arithmétique de dates :

const date = moment("2025-01-15");

const nextMonth = date.clone().add(1, "month");
const lastWeek = date.clone().subtract(1, "week");
const endOfMonth = date.clone().endOf("month");

console.log(nextMonth.format("YYYY-MM-DD")); // 2025-02-15
console.log(lastWeek.format("YYYY-MM-DD")); // 2025-01-08
console.log(endOfMonth.format("YYYY-MM-DD")); // 2025-01-31

Travailler avec les durées :

const start = moment("2025-01-01");
const end = moment("2025-12-31");

const duration = moment.duration(end.diff(start));

console.log(duration.asDays() + " days"); // 364 days
console.log(duration.asWeeks() + " weeks"); // 52 weeks
console.log(duration.humanize()); // a year

Comparer des dates :

const date1 = moment("2025-06-15");
const date2 = moment("2025-12-25");

console.log(date1.isBefore(date2)); // true
console.log(date1.isAfter(date2)); // false
console.log(date1.isSame(date2, "year")); // true
console.log(date1.isBetween("2025-01-01", "2025-08-01")); // true

Travailler avec les fuseaux horaires :

const now = moment();

console.log(now.tz("America/New_York").format("h:mm A z"));
console.log(now.tz("Europe/London").format("h:mm A z"));
console.log(now.tz("Asia/Tokyo").format("h:mm A z"));

Fonctionnalités

• Bibliothèque Moment.js complète : Accès à toutes les fonctions de Moment.js, y compris l’analyse, le formatage, la manipulation et la comparaison
• Prise en charge des fuseaux horaires : Moment Timezone est pré‑chargé pour travailler avec les fuseaux horaires du monde entier
• Exécution de code en direct : Le code s’exécute automatiquement au fur et à mesure que vous tapez grâce à un dé‑bouncing intelligent
• Terminal intégré : Visualisez instantanément la sortie console sans ouvrir les outils de développement du navigateur
• Coloration syntaxique : Mise en évidence de la syntaxe JavaScript pour une meilleure lisibilité du code
• Gestion des erreurs : Les erreurs d’exécution sont affichées clairement dans la sortie du terminal

Cas d’utilisation

• Apprendre Moment.js : Expérimentez avec l’API et voyez les résultats immédiatement, sans configuration de projet
• Tester des chaînes de format : Essayez différents jetons de format pour obtenir exactement la sortie de date souhaitée
• Déboguer des calculs de dates : Testez des arithmétiques de dates complexes avant de les implémenter dans votre application
• Conversions de fuseaux horaires : Convertissez rapidement des heures entre différents fuseaux horaires
• Maintenance de code hérité : Testez des extraits de code Moment.js lors de la maintenance d’applications existantes

Jetons de format courants

Référence des méthodes courantes

Unités de temps

Moment.js prend en charge les unités de temps suivantes pour les opérations add, subtract, startOf, endOf et diff :

• years / y
• quarters / Q
• months / M
• weeks / w
• days / d
• hours / h
• minutes / m
• seconds / s
• milliseconds / ms