Arbeiten mit Daten in TypeScript: beliebte Bibliotheken und Beispiele

Arbeiten mit Daten in TypeScript: Überblick über Bibliotheken

Die Arbeit mit Daten gehört zu den häufigsten Aufgaben in der Webentwicklung. In TypeScript (und JavaScript) hat das eingebaute Date-Objekt nur begrenzte Möglichkeiten und eine umständliche API. Glücklicherweise gibt es viele Bibliotheken, die das Formatieren, Parsen, Vergleichen und Manipulieren von Daten vereinfachen. In diesem Artikel betrachten wir vier beliebte Bibliotheken: date-fns, Day.js, Luxon und Moment.js, und zeigen Beispiele für ihre Verwendung in TypeScript.

1. date-fns — modular und leichtgewichtig

date-fns ist eine moderne Bibliothek, die auf dem Prinzip der Modularität basiert. Sie importieren nur die Funktionen, die Sie benötigen, was die Bundle-Größe minimal hält. date-fns unterstützt TypeScript von Haus aus hervorragend.

Installation:

npm install date-fns# oderyarn add date-fns

Anwendungsbeispiele:

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

// Formatierungconst today = new Date();console.log(format(today, 'yyyy-MM-dd')); // 2025-03-15

// Tage hinzufügenconst future = addDays(today, 10);console.log(format(future, 'dd.MM.yyyy')); // 25.03.2025

// Differenz zwischen Datenconst start = parseISO('2025-01-01');const end = parseISO('2025-03-15');console.log(differenceInDays(end, start)); // 73

// Prüfung auf Wochenendeimport { isWeekend } from 'date-fns';console.log(isWeekend(new Date(2025, 2, 15))); // true (Samstag)

2. Day.js — leichte Alternative zu Moment.js

Day.js ist eine minimalistische Bibliothek (nur 2 kB) mit einer API, die der von Moment.js sehr ähnlich ist. Sie ist ideal, wenn Sie von Moment migrieren, aber die Bundle-Größe reduzieren möchten. Day.js unterstützt TypeScript über Typen.

Installation:

npm install dayjs# oderyarn add dayjs

Anwendungsbeispiele:

import dayjs from 'dayjs';import relativeTime from 'dayjs/plugin/relativeTime';import utc from 'dayjs/plugin/utc';

dayjs.extend(relativeTime);dayjs.extend(utc);

// Erstellung und Formatierungconst now = dayjs();console.log(now.format('DD/MM/YYYY HH:mm')); // 15/03/2025 14:30

// Relative Zeitconsole.log(dayjs('2025-03-10').fromNow()); // 5 days ago

// Arbeiten mit UTCconst utcDate = dayjs.utc('2025-03-15T12:00:00Z');console.log(utcDate.local().format('HH:mm')); // lokale Zeit

// Manipulationenconst nextMonth = dayjs().add(1, 'month');console.log(nextMonth.format('MMMM YYYY')); // April 2025

3. Luxon — leistungsstark und modern

Luxon ist der Nachfolger von Moment.js, entwickelt vom selben Team. Es verwendet das native DateTime-Objekt, unterstützt Zeitzonen, Intervalle und Dauern. Luxon ist in TypeScript geschrieben und hat eine hervorragende Typisierung.

Installation:

npm install luxon# oderyarn add luxon

Anwendungsbeispiele:

import { DateTime, Interval, Duration } from 'luxon';

// Erstellung und Formatierungconst dt = DateTime.now();console.log(dt.toFormat('yyyy LLL dd')); // 2025 Mar 15

// Zeitzonenconst ny = DateTime.now().setZone('America/New_York');console.log(ny.toLocaleString(DateTime.DATETIME_FULL)); // March 15, 2025 at 9:30 AM EDT

// Intervalleconst start = DateTime.fromISO('2025-01-01');const end = DateTime.fromISO('2025-03-15');const interval = Interval.fromDateTimes(start, end);console.log(interval.length('days')); // 73

// Dauernconst dur = Duration.fromObject({ hours: 5, minutes: 30 });console.log(dur.toHuman()); // 5 hours, 30 minutes

// Parsen