Datenvalidierung in TypeScript: Zod, Yup, Joi

Datenvalidierung in TypeScript: Überblick über Werkzeuge und Praktiken

In der modernen Webentwicklung mit TypeScript ist die Gewährleistung der Datenintegrität eine der zentralen Aufgaben. Selbst bei strenger statischer Typisierung kann TypeScript nicht garantieren, dass Daten, die von außen kommen (API, Formulare, localStorage), dem erwarteten Format entsprechen. Hier kommt die Runtime-Validierung ins Spiel – die Überprüfung von Daten während der Programmausführung. In diesem Artikel betrachten wir drei beliebte Bibliotheken: Zod, Yup und Joi, vergleichen ihre Ansätze und zeigen, wie man die Validierung in ein TypeScript-Projekt integriert.

Warum reichen einfache TypeScript-Typen nicht aus?

TypeScript überprüft Typen zur Kompilierungszeit, aber zur Laufzeit werden alle Annotationen gelöscht. Das bedeutet:

Daten vom Benutzer können zusätzliche Felder enthalten oder Pflichtfelder fehlen
Zahlen können als Zeichenketten kommen
Objekte können null oder undefined sein

Validierungsbibliotheken lösen dieses Problem, indem sie Schemata bereitstellen, die sowohl als Prüfung als auch zur Typableitung dienen.

1. Zod – der moderne Standard

Zod ist die beliebteste Bibliothek für die Validierung in TypeScript. Ihr Hauptvorteil ist die automatische Ableitung von TypeScript-Typen aus Schemata.

Installation

npm install zod

Beispiel für ein Basisschema

import { z } from 'zod';

const UserSchema = z.object({  id: z.number().positive(),  name: z.string().min(2).max(50),  email: z.string().email(),  age: z.number().int().min(18).optional(),});

// Typableitung: { id: number; name: string; email: string; age?: number }type User = z.infer<typeof UserSchema>;

// Validierungconst result = UserSchema.safeParse(inputData);if (!result.success) {  console.error(result.error.errors);} else {  // result.data – korrekte Daten mit dem Typ User  processUser(result.data);}

Fortgeschrittene Möglichkeiten

Transformation: z.string().transform(val => val.trim())
Diskriminierte Vereinigungen: z.discriminatedUnion('type', [...])
Rekursive Schemata: z.lazy(() => NodeSchema)
Benutzerdefinierte Fehler: z.string().refine(val => !val.includes('bad'), 'Das Wort bad darf nicht verwendet werden')

2. Yup – ein bewährtes Werkzeug

Yup ist eine Bibliothek mit einer langen Geschichte, die ursprünglich für die Formularvalidierung entwickelt wurde. Sie lässt sich hervorragend mit Formik und React Hook Form integrieren.

Installation

npm install yup

Beispiel für ein Schema

import * as yup from 'yup';

const productSchema = yup.object({  title: yup.string().required('Name ist erforderlich').min(3),  price: yup.number().positive('Preis muss positiv sein').required(),  inStock: yup.boolean().default(true),});

type Product = yup.InferType<typeof productSchema>;

// ValidierungproductSchema.validate(inputData, { abortEarly: false })  .then(validData => console.log(validData))  .catch(err => console.error(err.errors));

Besonderheiten von Yup

Unterstützung für bedingte Validierung: .when('field', ...)
Integrierte Fehlermeldungen auf Deutsch (bei entsprechender Lokalisierung)
Einfache Arbeit mit verschachtelten Objekten und Arrays
Methoden cast() und transform() zur Typumwandlung

3. Joi – leistungsstark, aber schwerer

Joi ist eine legendäre Bibliothek aus dem Node.js-Ökosystem (Hapi.js). Sie bietet maximale Flexibilität, hat aber keine eingebaute Integration mit TypeScript (erfordert manuelle Typdefinitionen).