Was ist JSON?

JSON (JavaScript Object Notation) ist nicht nur für JavaScript essenziell, sondern wird auch als "gemeinsamer Modus" für die Interaktion einer Vielzahl von Technologien eingesetzt. Dieser ist auch deshalb so nützlich, weil er relativ leicht zu verstehen ist - JSON ist ein prägnantes, lesbares Format um Textdaten darzustellen. Dieser Artikel bietet einen Überblick über JSON und verrät Ihnen unter anderem, wie das Datenaustauschformat im Vergleich zu ähnlichen Standards wie XML, YAML und CSV abschneidet.

JavaScript Object Notation: Definition & Historie

JavaScript Object Notation wurde Anfang der 2000er Jahre als Teil von JavaScript eingeführt und nach und nach zum gängigsten Medium, um textbasierte Daten zu beschreiben und auszutauschen. Heute gilt JSON als universeller Standard für den Datenaustausch, der sich in jedem Bereich der Softwareentwicklung wiederfindet, einschließlich den Bereichen:

• Frontend,

• Server,

• System,

• Middleware und

• Datenbanken.

Ursprünglich wurde das JSON-Format für die Kommunikation zwischen JavaScript-Clients und Backend-Servern entwickelt. Es gewann schnell an Popularität als Tool für Front-End-Programmierer, um mit dem Back-End knapp und standardisiert zu kommunizieren. Dabei entdeckten die Entwickler auch, wie flexibel JSON ist: Sie konnten Felder ad hoc hinzufügen, entfernen und aktualisieren. Diese Flexibilität ging allerdings zunächst auf Kosten der Sicherheit, was später mit dem JSON-Schema behoben wurde (dazu später mehr).

Kurioserweise wurde JSON durch die AJAX-Revolution populär. Angesichts dessen XML-Fokus mutet es seltsam an, dass es JSON war, das AJAX seinen Glanz verlieh. Für Entwickler haben sich REST als API-Konvention und JSON als Medium für den Datenaustausch als wirksame Kombination etabliert, um Einfachheit, Flexibilität und Konsistenz miteinander in Einklang zu bringen.

Im nächsten Schritt breitete sich JSON von Front-End-JavaScript zur Client-Server-Kommunikation und von dort auf Systemkonfigurationsdateien, Back-End-Sprachen und Datenbanken aus. Das Datenaustauschformat trug sogar dazu bei, die NoSQL-Bewegung anzustoßen, die ihrerseits den Bereich Data Storage revolutionierte. Auch Datenbankadministratoren zeigten sich von der Flexibilität und der einfachen Programmierung von JSON begeistert.

Heute bieten dokumentenorientierte Datenspeicher wie MongoDB eine API, die mit JSON-ähnlichen Datenstrukturen arbeitet. In einem Interview Anfang 2022 erklärte der CTO von MongoDB, Mark Porter, JSON sei für ihn in Sachen Daten immer noch tonangebend. Nicht schlecht für ein Datenformat, das mit einer einfachen geschweiften Klammer und einem Doppelpunkt seinen Anfang nahm.

JSON - in der Softwareentwicklung

Unabhängig von der Art des Programms oder des Anwendungsfalls, an dem sie arbeiten, benötigen Softwareentwickler eine Möglichkeit, um Daten zu beschreiben und auszutauschen. Diese Notwendigkeit manifestiert sich in Datenbanken, Geschäftslogik, Benutzeroberflächen und der gesamten Systemkommunikation. Um Daten für den Austausch zu strukturieren, gibt es viele verschiedene Ansätze. Diese lassen sich in zwei wesentliche große Lager aufteilen: binär und textbasiert. Bei JavaScript Object Notation handelt es sich um ein textbasiertes Format, das sowohl von Menschen als auch von Maschinen gelesen werden kann. JSON ist aus mehreren Gründen eine äußerst erfolgreiche Methode zur Formatierung von Daten:

• Es ist in JavaScript enthalten und wird innerhalb von JavaScript-Programmen als JSON-Literal verwendet.

• JSON kann auch mit anderen Programmiersprachen verwendet werden und ist daher für den Datenaustausch zwischen heterogenen Systemen nützlich.

• Für eine Sprachdatenstruktur ist JSON ein unglaublich vielseitiges Werkzeug, da es auch für Menschen lesbar ist.

• JSON ist - insbesondere im Vergleich zu anderen Formaten - relativ einfach zu verwenden.

JSON - Funktionsweise

Wenn Sie Ihren Benutzernamen und Ihr Passwort in ein Webseiten-Formular eingeben, interagieren Sie mit einem Objekt mit zwei Feldern: Benutzername und Passwort.

JSON für Login-Seiten

Das folgende Beispiel beschreibt eine solche Login Page mit JSON:

{

username: "Bilbo Baggins",

password: "fkj3442jv9dwwf"

}

Alles innerhalb der geschweiften Klammern ( {...} ) gehört zum selben Objekt. Ein Objekt bezieht sich in diesem Fall im allgemeinsten Sinne auf ein "einzelnes Ding". Innerhalb der geschweiften Klammern stehen die Eigenschaften, die zu dem Objekt gehören. Jede Eigenschaft besteht aus zwei Teilen: einem Namen und einem Wert - getrennt durch einen Doppelpunkt. Diese werden als Schlüssel (Keys) und Werte (Values) bezeichnet. In Listing 1 ist "username" ein Schlüssel (Key) und "Bilbo Baggins" ein Wert (Value).

Eigenschaften, Felder und Attribute

Jedes dieser Elemente wird verwendet, um auf die Teile eines JSON-Objekts zu verweisen. Technisch gesehen werden sie im Kontext einer objektorientierten Programmiersprache als "Members" bezeichnet. Jede Eigenschaft, jedes Feld oder Attribut ist ein Mitglied eines Objekts.

Das Wichtigste dabei ist: JSON erledigt alles Notwendige, um den Bedarf - in diesem Fall die Informationen im Formular - zu decken, ohne eine Menge zusätzlicher Informationen zu benötigen. Sie können einen Blick auf diese JSON-Datei werfen und verstehen sie. Diese Prägnanz macht JSON auch zu einem ausgezeichneten Format, um Daten über das Web auszutauschen.

JSON vs. XML

JSON wurde als XML-Alternative entwickelt, einst das vorherrschende Format für den Datenaustausch.

Login-Formular mit XML

Folgendes Beispiel zeigt ein Anmeldeformular, das mit XML beschrieben wird:

<UserLogin>

<Username>Samwise Gamgee</Username>

<Password>ghB5fK5</Password>

</UserLogin>

Schon der Anblick dieses Formulars ist anstrengend. Stellen Sie sich vor, Sie müssten es im Code erstellen und parsen. Im Gegensatz dazu ist es simpel, JSON in JavaScript zu verwenden.

JSON in JavaScript verwenden

Drücken Sie F12 in Ihrem Browser, um eine JavaScript-Konsole zu öffnen, und fügen Sie dann das folgende JSON-Beispiel ein:

let hobbitJson = {

name: "Pippin",

hometown: "Shire"

}

console.log(hobbitJson.name); // outputs "Pippin"

hobbitJson.bestFriend = "Merry"; // modify the object

console.log(JSON.stringify(hobbitJson)); //output entire object

// {"name":"Pippin","hometown":"Shire","bestFriend":"Merry"}

XML ist schwer zu lesen und lässt in Bezug auf die Codierungs-Agilität zu wünschen übrig. JSON wurde entwickelt, um diese Probleme zu lösen und hat XML auch deshalb mehr oder weniger verdrängt.

JSON vs. YAML vs. CSV

Zwei Datenformate, die manchmal mit JSON verglichen werden, sind YAML und CSV. Diese beiden Formate befinden sich an entgegengesetzten Enden des zeitlichen Spektrums:

• CSV ist ein uraltes, vordigitales Format, das schließlich auch seinen Weg in die IT-Welt fand. Es ist eine einfache Liste von Werten, bei der jeder Eintrag durch ein Komma oder ein anderes Trennzeichen gekennzeichnet wird - mit einer optionalen ersten Zeile von Kopffeldern. Als Austauschmedium und Programmierstruktur bietet CSV eher begrenzte Möglichkeiten. Dennoch ist es für die Ausgabe großer Datenmengen nützlich. Die tabellarische Organisation von CSV ideal für Tabellenkalkulationen.

• YAML hingegen wurde von JSON inspiriert und ist eine Art konzeptioneller Nachfahre und ein "Superset" von JSON - es unterstützt also alles, was auch JSON unterstützt. Dabei bietet YAML allerdings auch eine reduzierte Syntax, die noch prägnanter sein soll als die von JSON. YAML verwendet beispielsweise Einrückungen für die Hierarchie und verzichtet auf geschweifte Klammern. Obwohl es gelegentlich als Datenaustauschformat verwendet wird, findet YAML vor allem in Konfigurationsdateien Verwendung. Dieser Artikel verrät Ihnen mehr Details zu den Unterschieden zwischen YAML und JSON.

JSON in komplex - Nesting, Objects & Arrays

Bisher haben wir nur JSON-Beispiele mit "flachen" oder einfachen Objekten betrachtet. JSON ist auch in der Lage, beliebige komplexe Datenstrukturen zu modellieren, zum Beispiel Objekt- und zyklische Graphen, das heißt Strukturen mit zirkulären Referenzen. In diesem Abschnitt betrachten wir Beispiele für die komplexe Modellierung mit Nesting (Verschachtelung), Objektreferenzen und Arrays.

JSON mit verschachtelten Objekten

Folgendes Beispiel zeigt, wie man verschachtelte JSON-Objekte definiert:

let merry = { name: "Merry",

bestfriend: {

name: "Pippin"

}

}

Die Eigenschaft bestfriend bezieht sich auf ein anderes Objekt, das inline als JSON-Literal definiert ist.

JSON mit Objektreferenzen

Im folgenden Beispiel wird statt eines Namens in der Eigenschaft bestfriend ein Verweis auf das eigentliche Objekt verwendet:

let merry = { race: "hobbit", name: "Merry Brandybuck" }

let pippin = {race: "hobbit", name: "Pippin Took", bestfriend: merry }

console.log(JSON.stringify(pippin.bestfriend.name)); // outputs "Merry Brandybuck"

Hier legen wir das Handle auf das Objekt merry in der Eigenschaft bestfriend. Dann können wir das eigentliche merry-Objekt über die bestfriend-Eigenschaft des pippin-Objekts abrufen. Den Namen des Objekts merry erhalten wir über die Eigenschaft name. Dies wird auch als "traversing the object graph" bezeichnet, was per Dot Operator erledigt wird.

JSON mit Arrays

Eine andere Art von Struktur, die JSON-Eigenschaften haben können, sind Arrays. Diese sehen genauso aus wie JavaScript-Arrays und werden mit einer eckigen Klammer gekennzeichnet, wie folgendes Beispiel zeigt:

{

towns: [ "The Shire", "Rivendale", "Gondor" ]

}

Natürlich können Arrays auch Verweise auf andere Objekte enthalten. Mit diesen beiden Strukturen kann JSON jede Art von komplexer Objektbeziehung modellieren.

Zusammenfassung der JSON-Value-Typen

Bisher haben Sie Strings, Objekte und Arrays als Wertetypen kennengelernt. Weitere sind:

• string

• number

• object

• array

• true

• false

• null

JSON - Parsing & Generating

JSON zu parsen und zu generieren bedeutet, es zu lesen beziehungsweise zu erstellen. JSON.stringify() haben Sie bereits in Aktion gesehen. Das ist der eingebaute Mechanismus für JavaScript-Programme, um eine speicherinterne Objektdarstellung in einen JSON-String zu verwandeln. Um in die andere Richtung zu gehen, also einen JSON-String in ein speicherinternes Objekt zu verwandeln, verwenden Sie JSON.parse().

Die meisten anderen Programmiersprachen verwenden für diese Aufgabe die Bibliothek eines Drittanbieters. In Java zum Beispiel gibt es zahlreiche Bibliotheken, die bekanntesten sind Jackson und GSON. Diese Bibliotheken sind komplexer als stringify und parse in JavaScript, bieten aber auch fortgeschrittene Funktionen wie Mapping benutzerdefinierter Typen und den Umgang mit anderen Datenformaten.

In JavaScript ist es üblich, JSON an, beziehungsweise über Server zu senden, respektive zu empfangen. Zum Beispiel mit der eingebauten fetch()-API. Dabei können Sie die Antwort automatisch parsen:

fetch('https://the-one-api.dev/v2/character')

.then((data) => console.log(data));

Sobald Sie JSON in eine speicherinterne Datenstruktur umgewandelt haben, sei es in JavaScript oder eine anderen Sprache, können Sie die APIs zur Bearbeitung der Struktur verwenden. In JavaScript würde man beispielsweise auf das im Beispiel geparste JSON wie auf jedes andere JavaScript-Objekt zugreifen - vielleicht durch Schleifenbildung über data.keys oder durch Zugriff auf bekannte Eigenschaften des Datenobjekts.

JWTs

JSON wird darüber hinaus auch für die Authentifizierung verwendet. Entwickler und andere verwenden JSON-Web-Tokens oder JWTs, um Authentifizierungsansprüche zu kommunizieren. JWTs haben ein standardisiertes, kompaktes Format und sind kryptografisch signiert, um Manipulationen zu verhindern. Sie können zudem auch verschlüsselt werden.

JSON - Schema & Formatter

JavaScript und JSON sind unglaublich flexibel, aber manchmal braucht man mehr Struktur. In einer Sprache wie Java helfen starke Typisierung und abstrakte Typen (wie Schnittstellen) bei der Strukturierung umfangreicher Programme. In SQL-Speichern bietet ein Schema eine ähnliche Struktur. Wenn Sie mehr Struktur in Ihren JSON-Dokumenten benötigen, können Sie ein JSON-Schema verwenden, um die Eigenschaften Ihrer Objekte explizit zu definieren. Nach der Definition können Sie das Schema verwenden, um Objektinstanzen zu validieren und sicherzustellen, dass sie mit dem Schema übereinstimmen.

Ein weiteres Problem ist der Umgang mit maschinell verarbeitetem JSON, das minifiziert und damit unlesbar ist. Glücklicherweise lässt sich dieses Problem leicht lösen: Nutzen Sie zum Beispiel den JSON Formatter & Validator. Sie erhalten dann eine für Menschen lesbare Version, die Sie verwenden können. Die meisten IDEs haben auch einen eingebauten JavaScript-Formatter an Bord.

JSON - auch mit TypeScript?

TypeScript ermöglicht die Definition von Typen und Schnittstellen - es kann also in einigen Fällen Sinn machen, JSON mit TypeScript zu verwenden. Eine Klasse umreißt - wie ein Schema - die zulässigen Eigenschaften einer Instanz eines bestimmten Typs. In einfachem JavaScript gibt es keine Möglichkeit, Eigenschaften und ihre Typen einzuschränken. JavaScript-Klassen sind wie Vorschläge; der Programmierer kann sie jetzt festlegen und das JSON später ändern. Eine TypeScript-Klasse erzwingt jedoch, welche Eigenschaften und Typisierung das JSON aufweisen kann. (fm)

Dieser Beitrag basiert auf einem Artikel unserer US-Schwesterpublikation Infoworld.