Moment.js Speelveld

Wat is Moment.js?

Moment.js is een veelgebruikte JavaScript-bibliotheek voor het parseren, valideren, manipuleren en formatteren van datums. Voordat moderne alternatieven verschenen, was Moment.js de de facto standaard voor datumverwerking in JavaScript-toepassingen. Het biedt een nette, ketenbare API die het werken met datums intuïtief en eenvoudig maakt. Hoewel nieuwere bibliotheken zoals date-fns en Luxon bestaan, wordt Moment.js nog steeds veel gebruikt in legacy-codebases en wordt het actief onderhouden voor bugfixes. Moment.js begrijpen is essentieel voor ontwikkelaars die werken met bestaande projecten die ervan afhankelijk zijn.

Waarom een datummanipulatiebibliotheek gebruiken?

Het native Date-object van JavaScript is berucht moeilijk om mee te werken. Het vertoont inconsistente gedragingen tussen browsers, verwarrende maandindexering (0-11 in plaats van 1-12), beperkte opmaakopties en geen ingebouwde tijdzone-ondersteuning. Datum-bibliotheken zoals Moment.js lossen deze problemen op door een consistente, goed gedocumenteerde API te bieden. Ze behandelen randgevallen zoals overgangen naar zomertijd, schrikkeljaren en opmaak op basis van locale automatisch, waardoor ontwikkelaars niet zelf foutgevoelige datumlogica vanaf nul hoeven te schrijven.

Toolbeschrijving

De Moment.js Playground is een interactieve, browsergebaseerde omgeving om te experimenteren met de Moment.js-bibliotheek. Schrijf en voer JavaScript-code direct uit in de editor met volledige toegang tot Moment.js en Moment Timezone. De playground voert je code automatisch uit terwijl je typt (met debouncing) en toont alle console-uitvoer in een terminal-achtig paneel eronder. Het is perfect om Moment.js te leren, datumformatteer‑strings te testen, datumcalculaties te debuggen en tijdgerelateerde logica te prototypen zonder een ontwikkelomgeving op te zetten.

Voorbeelden

Formateer de huidige datum:

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

Parse verschillende datumformaten:

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)

Bereken relatieve tijd:

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

Datumrekenkunde:

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

Werken met duur:

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

Vergelijk datums:

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

Werken met tijdzones:

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"));

Functies

• Volledige Moment.js-bibliotheek: Toegang tot alle Moment.js-functies, inclusief parsen, formatteren, manipulatie en vergelijking
• Tijdzone-ondersteuning: Moment Timezone is vooraf geladen voor werken met tijdzones wereldwijd
• Live code‑executie: Code wordt automatisch uitgevoerd terwijl je typt met slimme debouncing
• Ingebouwde terminal: Bekijk console‑output direct zonder de ontwikkelaarstools van de browser te openen
• Syntax‑highlighting: JavaScript-syntax‑highlighting voor betere code‑leesbaarheid
• Foutafhandeling: Runtime‑fouten worden duidelijk weergegeven in de terminaloutput

Gebruikssituaties

• Moment.js leren: Experimenteer met de API en zie direct resultaten zonder projectopzet
• Format‑string testen: Probeer verschillende format‑tokens om de exacte datumoutput te krijgen die je nodig hebt
• Datumcalculatie debuggen: Test complexe datumrekenkunde voordat je deze implementeert in je applicatie
• Tijdzone‑conversies: Converteer snel tijden tussen verschillende tijdzones
• Legacy‑codeonderhoud: Test Moment.js‑codefragmenten bij het onderhouden van bestaande applicaties

Veelvoorkomende format‑tokens

Veelvoorkomende methodenreferentie

Tijdseenheden

Moment.js ondersteunt de volgende tijdseenheden voor add, subtract, startOf, endOf en diff‑operaties:

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