Developer

JSON-Formatierung und Validierung: Eine Kurzreferenz für Entwickler

JSON wie ein Profi formatieren, validieren und verstehen. Behandelt Syntaxregeln, häufige Fehler, JSONPath und praktische Tools für die Arbeit mit JSON-Daten.

7 Min. Lesezeit

Code on screen

JSON (JavaScript Object Notation) ist die Lingua franca der Web-APIs. Vom Design her simpel – aber ein einzelnes fehlendes Komma oder eine nicht übereinstimmende geschweifte Klammer kann eine Anwendung stillschweigend zum Absturz bringen. Hier ist alles, was du brauchst, um sicher mit JSON zu arbeiten.

JSON-Syntax in 90 Sekunden

JSON hat genau sechs Werttypen:

{
  "string": "hello world",
  "number": 42,
  "boolean": true,
  "null_value": null,
  "array": [1, 2, 3],
  "object": { "nested": "value" }
}

Regeln, über die man leicht stolpert:

  • Schlüssel müssen in doppelten Anführungszeichen stehen — {name: "Alice"} ist kein gültiges JSON
  • Keine abschließenden Kommas — [1, 2, 3,] ist ungültig
  • Keine Kommentare — JSON kennt keine //- oder /* */-Syntax
  • Zeichenketten müssen doppelte Anführungszeichen verwenden — einfache Anführungszeichen sind nicht erlaubt
  • Zahlen dürfen keine führenden Nullen haben — 007 ist ungültig

Die häufigsten JSON-Fehler

1. Abschließendes Komma

// Ungültig
{ "a": 1, "b": 2, }

// Gültig
{ "a": 1, "b": 2 }

2. Einfach angeführte Zeichenketten

// Ungültig
{ 'name': 'Alice' }

// Gültig
{ "name": "Alice" }

3. Nicht angeführte Schlüssel

// Ungültig
{ name: "Alice" }

// Gültig
{ "name": "Alice" }

4. Undefined- oder NaN-Werte — Diese JavaScript-Werte existieren in JSON nicht. Verwende stattdessen null.

Formatieren vs. Minimieren

Pretty-printed JSON (formatiert) verwendet Einrückungen und Zeilenumbrüche zur besseren Lesbarkeit:

{
  "user": {
    "id": 1,
    "name": "Alice"
  }
}

Minifiziertes JSON entfernt alle Leerzeichen:

{"user":{"id":1,"name":"Alice"}}

Verwende formatiertes JSON in Konfigurationsdateien und Quellcode. Nutze minifiziertes JSON in API-Antworten und zur Datenspeicherung, um die Payload-Größe zu reduzieren. Unser JSON Formatter wechselt mit einem Klick zwischen beiden Varianten.

JSON Schema-Validierung

JSON Schema ermöglicht es, die erwartete Struktur eines JSON-Dokuments zu definieren und Daten dagegen zu validieren. Das ist unverzichtbar für API-Verträge und die Validierung von Konfigurationsdateien.

Ein einfaches Schema:

{
  "$schema": "http://json-schema.org/draft-07/schema#",
  "type": "object",
  "required": ["name", "age"],
  "properties": {
    "name": { "type": "string" },
    "age": { "type": "integer", "minimum": 0 }
  }
}

Dieses Schema lehnt jedes Objekt ab, dem name oder age fehlt oder bei dem age negativ ist. Der JSON Schema Validator ermöglicht es, Schema und Daten einzufügen und in Echtzeit zu validieren.

TypeScript-Typen aus JSON generieren

Wenn du eine JSON-Antwort von einer API erhältst und TypeScript-Interfaces benötigst, füge das JSON in unseren JSON to TypeScript-Konverter ein. Er leitet Typen aus der Datenstruktur ab:

Eingabe:

{ "id": 1, "name": "Alice", "active": true, "tags": ["admin"] }

Ausgabe:

interface Root {
  id: number;
  name: string;
  active: boolean;
  tags: string[];
}

JSONPath: Verschachtelte Daten abfragen

JSONPath verhält sich zu JSON wie XPath zu XML – eine Abfragesprache zum Extrahieren von Werten aus verschachtelten Strukturen. Grundlegende Syntax:

Ausdruck Bedeutung
$.store.book Der book-Schlüssel innerhalb von store
$.store.book[0] Erstes Buch
$.store.book[*].title Alle Buchtitel
$..price Alle price-Werte im gesamten Dokument

Der JSON Path Finder ermöglicht es, auf einen beliebigen Wert in einem gerenderten JSON-Baum zu klicken, und kopiert den Pfad automatisch.

Zwei JSON-Objekte vergleichen

Beim Debuggen von API-Änderungen oder Konfigurationsabweichungen muss man sehen, was sich zwischen zwei JSON-Objekten geändert hat. Der JSON Diff Viewer hebt hinzugefügte, entfernte und geänderte Felder nebeneinander hervor.

JSON in Zod-Schema konvertieren

Wer Zod für die Laufzeitvalidierung in TypeScript verwendet, kann mit dem JSON to Zod-Tool Beispiel-JSON in ein sofort verwendbares Zod-Schema umwandeln – mit intelligenter Typinferenz für E-Mail-, URL- und Datetime-Felder.

Zusammenfassung

JSON ist einfach, aber unnachgiebig. Validiere immer vor dem Parsen, verwende TypeScript-Interfaces, um Strukturabweichungen zur Kompilierzeit zu erkennen, und halte einen Formatter zum Debuggen von API-Antworten bereit. Diese Gewohnheiten verhindern ganze Kategorien von Laufzeitfehlern.