--- title: "Was ist JSON? Das Datenformat einfach erklärt" description: "Was ist JSON? Ich erkläre das JSON-Format verständlich mit Beispielen. Syntax, Parsing in JavaScript und Dart, JSON vs XML und typische Fehler vermeiden." canonical_url: "https://robocitrus.com/blog/json-einfach-erklaert" last_updated: "2026-07-19T00:12:58.920Z" --- Jede API spricht JSON. Jede Config-Datei ist JSON. Wenn du dich mit App-Entwicklung, Webentwicklung oder irgendetwas beschäftigst, das mit Daten zu tun hat, triffst du auf JSON. Und das Beste daran: Es ist wirklich nicht schwer zu verstehen. Fünf Minuten, und du kannst JSON lesen und schreiben. Ich arbeite jeden Tag mit JSON -- in API-Responses, in Konfigurationsdateien, in Datenbanken. Es ist die Lingua franca der modernen Softwareentwicklung. --- ## Kurz zusammengefasst - **JSON** steht für JavaScript Object Notation -- ein textbasiertes, lesbares Datenformat - JSON kennt Objekte `{}`, Arrays `[]`, Strings, Zahlen, Booleans und `null` - Es ist der Standard für API-Kommunikation und Konfigurationsdateien - JSON ist sprachunabhängig und wird von jeder Programmiersprache unterstützt - Häufige Fehler: Trailing Commas, einfache Anführungszeichen, Kommentare (alles nicht erlaubt) --- ## Das Versand-Etikett der Softwarewelt Stell dir ein Paket vor, das von Deutschland nach Japan geschickt wird. Auf dem Etikett stehen Absender, Empfänger, Gewicht, Inhalt -- alles in einem standardisierten Format, das jeder Paketdienst weltweit lesen kann. Egal ob DHL, FedEx oder Japan Post. JSON ist genau so ein standardisiertes Etikett -- nur für Daten. Egal ob dein Server mit Python läuft, deine App in Flutter geschrieben ist und dein Frontend React nutzt: Alle verstehen JSON. Es ist das universelle Datenformat, auf das sich die Softwarewelt geeinigt hat. ## Was ist JSON? JSON steht für **JavaScript Object Notation**. Trotz des Namens ist JSON nicht auf JavaScript beschränkt. Es ist ein eigenständiges, textbasiertes Datenformat, das von jeder Programmiersprache gelesen und geschrieben werden kann. Die Idee dahinter: Daten in einem Format austauschen, das sowohl **für Menschen lesbar** als auch **für Maschinen verarbeitbar** ist. Und das hat JSON geschafft. Es ist simpler als XML, lesbarer als Binärformate und überall unterstützt. JSON wurde Anfang der 2000er Jahre von Douglas Crockford popularisiert und hat sich seitdem als der Standard für Datenaustausch im Web etabliert. Wenn du heute eine [API](/blog/was-ist-eine-api) aufrufst, bekommst du in 99% der Fälle JSON zurück. ## JSON-Syntax: Die Grundlagen JSON kennt genau sechs Datentypen. Das war's. Keine Klassen, keine Vererbung, keine Magie. ### Objekte Ein JSON-Objekt ist eine Sammlung von Schlüssel-Wert-Paaren, eingeschlossen in geschweifte Klammern `{}`: ```json { "name": "Maximilian", "alter": 28, "entwickler": true } ``` Jeder Schlüssel ist ein String in doppelten Anführungszeichen. Der Wert kann ein beliebiger JSON-Typ sein. ### Arrays Ein Array ist eine geordnete Liste von Werten, eingeschlossen in eckige Klammern `[]`: ```json { "sprachen": ["Dart", "JavaScript", "TypeScript", "Python"] } ``` ### Strings Immer in doppelten Anführungszeichen. Einfache Anführungszeichen sind **nicht** erlaubt: ```json { "nachricht": "Hallo Welt" } ``` ### Zahlen Ganze Zahlen und Dezimalzahlen, ohne Anführungszeichen: ```json { "preis": 49.99, "menge": 3 } ``` ### Booleans `true` oder `false`, kleingeschrieben, ohne Anführungszeichen: ```json { "aktiv": true, "geloescht": false } ``` ### Null Der Wert "nichts", kleingeschrieben: ```json { "telefon": null } ``` ## Praxis-Beispiel: Ein Nutzerprofil als JSON So sieht ein typisches Nutzerprofil aus, wie es eine API zurückgeben könnte: ```json { "id": 42, "benutzername": "max_dev", "email": "max@example.com", "profil": { "vorname": "Maximilian", "nachname": "Flechtner", "avatar": "https://example.com/avatars/42.webp", "bio": "App-Entwickler aus Leidenschaft" }, "einstellungen": { "theme": "dark", "sprache": "de", "benachrichtigungen": true }, "projekte": [ { "name": "Meine erste App", "technologie": "Flutter", "status": "live" }, { "name": "Portfolio-Website", "technologie": "Nuxt", "status": "in-entwicklung" } ], "erstelltAm": "2024-03-15T10:30:00Z" } ``` Schau dir an, wie gut das lesbar ist. Objekte in Objekten, ein Array von Projekten, verschiedene Datentypen -- und trotzdem versteht man sofort, was die Daten bedeuten. Das ist die Stärke von JSON. ## JSON in der Praxis JSON ist überall. Hier die drei häufigsten Anwendungsfälle: ### API-Responses Wenn deine App Daten von einem Server abruft, kommt die Antwort fast immer als JSON. Egal ob du [REST oder GraphQL](/blog/rest-vs-graphql) nutzt -- die Daten sind JSON. ### Konfigurationsdateien `package.json`, `tsconfig.json`, `firebase.json` -- unzählige Tools nutzen JSON für ihre Konfiguration. Du bearbeitest täglich JSON-Dateien, vielleicht ohne es bewusst zu merken. ### Datenbanken NoSQL-Datenbanken wie MongoDB oder Firestore speichern Daten als JSON-ähnliche Dokumente. Du schreibst JSON rein und bekommst JSON raus. ## Code-Beispiel: JSON parsen ### In JavaScript ```javascript // JSON-String zu JavaScript-Objekt const jsonString = '{"name": "Max", "alter": 28}'; const user = JSON.parse(jsonString); console.log(user.name); // "Max" // JavaScript-Objekt zu JSON-String const daten = { sprache: "Dart", level: "fortgeschritten" }; const json = JSON.stringify(daten, null, 2); console.log(json); // { // "sprache": "Dart", // "level": "fortgeschritten" // } ``` `JSON.parse()` macht aus einem JSON-String ein JavaScript-Objekt. `JSON.stringify()` macht das Gegenteil. Der dritte Parameter (`2`) sorgt für hübsche Einrückung. ### In Dart (Flutter) ```dart import 'dart:convert'; // JSON-String zu Dart Map final jsonString = '{"name": "Max", "alter": 28}'; final Map user = jsonDecode(jsonString); print(user['name']); // "Max" // Dart Map zu JSON-String final daten = {'sprache': 'Dart', 'level': 'fortgeschritten'}; final json = jsonEncode(daten); print(json); // {"sprache":"Dart","level":"fortgeschritten"} // Mit hübscher Formatierung final encoder = JsonEncoder.withIndent(' '); print(encoder.convert(daten)); ``` In Dart nutzt du `jsonDecode()` und `jsonEncode()` aus dem `dart:convert`-Paket. In echten Flutter-Projekten arbeitet man meistens mit Model-Klassen und Bibliotheken wie `json_serializable` oder `freezed`, die das Mapping automatisch generieren. ## JSON vs XML: Der Vergleich Bevor JSON kam, war XML der Standard. Hier der direkte Vergleich:
Kriterium JSON XML
Lesbarkeit Sehr gut Gut, aber verbose
Dateigröße Kompakt Deutlich größer
Parsing Schnell und einfach Aufwendiger
Datentypen Eingebaut (String, Number, Boolean) Alles ist Text
Kommentare Nicht möglich Möglich
Schema-Validierung JSON Schema (optional) XSD (etabliert)
Verbreitung (Web) Dominierend Rückläufig
Ein Beispiel macht den Unterschied deutlich. Dasselbe Nutzerprofil in XML: ```xml Max 28 true Dart JavaScript ``` Und in JSON: ```json { "name": "Max", "alter": 28, "entwickler": true, "sprachen": ["Dart", "JavaScript"] } ``` JSON ist kürzer, lesbarer und einfacher zu parsen. Für neue Projekte gibt es kaum noch einen Grund, XML zu wählen -- es sei denn, du arbeitest mit Legacy-Systemen oder brauchst fortgeschrittene Schema-Validierung. ## Häufige Fehler (und wie du sie vermeidest) Ich sehe diese Fehler ständig, besonders bei Anfängern: ### 1. Trailing Commas ```json { "name": "Max", "alter": 28, // FEHLER: Komma nach dem letzten Wert } ``` In JavaScript ist ein Trailing Comma erlaubt. In JSON **nicht**. Das letzte Element darf kein Komma haben. ### 2. Einfache Anführungszeichen ```json { 'name': 'Max' // FEHLER: Einfache Anführungszeichen } ``` JSON erlaubt **nur** doppelte Anführungszeichen. Keine einfachen, keine Backticks. ### 3. Kommentare ```json { "name": "Max", // Das ist ein Kommentar -- FEHLER "alter": 28 } ``` JSON unterstützt **keine Kommentare**. Nicht mit `//`, nicht mit `/* */`. Wenn du Kommentare brauchst, nutze ein Format wie JSONC (JSON with Comments) oder YAML. ### 4. Unquoted Keys ```json { name: "Max" // FEHLER: Schlüssel ohne Anführungszeichen } ``` Schlüssel müssen immer Strings in doppelten Anführungszeichen sein. **Tipp:** Nutze einen JSON-Validator wie [jsonlint.com](https://jsonlint.com), um dein JSON zu überprüfen. Oder lass deinen Editor die Arbeit machen -- VS Code markiert JSON-Fehler sofort. ## Fazit JSON ist eines der einfachsten und nützlichsten Konzepte in der Softwareentwicklung. Sechs Datentypen, eine simple Syntax, universelle Unterstützung. Wenn du JSON verstehst, verstehst du, wie Daten im modernen Web fließen. Und das Beste: Du brauchst es nicht auswendig zu lernen. Nach ein paar Tagen mit APIs und Konfigurationsdateien liest und schreibst du JSON im Schlaf. Es ist das Format, das du am häufigsten sehen wirst -- egal ob du [APIs aufrufst](/blog/was-ist-eine-api), [REST oder GraphQL](/blog/rest-vs-graphql) nutzt oder Konfigurationen bearbeitest. Fang einfach an. Öffne eine `package.json` in deinem nächsten Projekt und schau sie dir an. Du wirst überrascht sein, wie viel du jetzt schon verstehst. ## Häufig gestellte Fragen Nein. JSON ist ein Datenformat, keine Programmiersprache. Du kannst mit JSON keine Logik schreiben, keine Schleifen bauen, keine Berechnungen machen. JSON beschreibt ausschließlich Daten. Der Name "JavaScript Object Notation" ist irreführend -- JSON ist sprachunabhängig und funktioniert mit jeder Programmiersprache. JSON wurde bewusst minimalistisch gehalten. Douglas Crockford hat Kommentare absichtlich weggelassen, damit JSON nicht als Konfigurationssprache missbraucht wird. Für Konfigurationsdateien, bei denen du Kommentare brauchst, gibt es Alternativen wie JSONC (JSON with Comments), YAML oder TOML. JSON ist immer ein String -- reiner Text. Ein JavaScript-Objekt ist ein Datentyp im Speicher. JSON-Keys müssen in doppelten Anführungszeichen stehen, JavaScript-Objekt-Keys nicht. JSON erlaubt keine Funktionen, Kommentare oder Trailing Commas -- JavaScript-Objekte schon. Mit `JSON.parse()` machst du aus einem JSON-String ein JS-Objekt, mit `JSON.stringify()` umgekehrt.