Arbeiten mit JSON in JavaScript: Parsen und Serialisierung für Anfänger

Einführung in JSON und JavaScript

JSON (JavaScript Object Notation) ist ein leichtgewichtiges Datenaustauschformat, das zum Standard für die Kommunikation zwischen Client und Server in Webanwendungen geworden ist. Aufgrund seiner Einfachheit und Lesbarkeit wird JSON überall eingesetzt: von Konfigurationsdateien bis hin zu API-Anfragen. In diesem Artikel werden wir uns damit befassen, wie man mit JSON in der Node.js-Umgebung arbeitet, das Parsen (Umwandlung eines Strings in ein Objekt) und die Serialisierung (Umwandlung eines Objekts in einen String) erlernen. Das Material richtet sich an Anfänger, die bereits mit den Grundlagen von JavaScript vertraut sind.

Was ist JSON und wozu wird es benötigt?

JSON ist ein textbasiertes Format, das auf der Syntax von JavaScript-Objekten basiert. JSON ist jedoch lediglich ein String, der über ein Netzwerk übertragen oder in einer Datei gespeichert werden kann. Die grundlegenden Datentypen in JSON sind:

\n
• Zeichenketten (in doppelten Anführungszeichen)
\n
• Zahlen (ganze Zahlen und Gleitkommazahlen)
\n
• Boolesche Werte (true/false)
\n
• null
\n
• Arrays
\n
• Objekte (Schlüssel in doppelten Anführungszeichen)
\n

Beispiel für einen gültigen JSON-String:

{\n  "name": "Anna",\n  "age": 28,\n  "isStudent": false,\n  "skills": ["JavaScript", "Node.js"],\n  "address": null\n}

Im Gegensatz zu einem normalen JavaScript-Objekt erfordert JSON eine strenge Syntax: Alle Schlüssel und Zeichenkettenwerte werden in doppelte Anführungszeichen gesetzt, und Kommentare sind nicht erlaubt.

JSON parsen: JSON.parse()

Zur Umwandlung eines JSON-Strings in ein JavaScript-Objekt wird die Methode JSON.parse() verwendet. Dies ist notwendig, wenn Sie Daten vom Server erhalten, eine Datei lesen oder Benutzereingaben verarbeiten.

Einfaches Beispiel für das Parsen

const jsonString = '{"name": "Ivan", "age": 30}';\nconst user = JSON.parse(jsonString);\nconsole.log(user.name); // Ivan\nconsole.log(user.age);  // 30

Parsen eines Arrays

const jsonArray = '[1, 2, "drei", true]';\nconst arr = JSON.parse(jsonArray);\nconsole.log(arr[2]); // drei

Fehlerbehandlung beim Parsen

Ungültiges JSON löst eine SyntaxError-Ausnahme aus. Verwenden Sie bei der Arbeit mit unsicheren Daten immer try...catch:

try {\n  const invalid = '{"name": "Fehler}';\n  const result = JSON.parse(invalid);\n} catch (error) {\n  console.error('Parsing-Fehler:', error.message);\n}

Sie können auch ein zweites Argument übergeben – eine reviver-Funktion, die es ermöglicht, Werte während des Parsens zu transformieren:

const json = '{"date": "2024-01-15", "count": "42"}';\nconst obj = JSON.parse(json, (key, value) => {\n  if (key === 'date') return new Date(value);\n  if (key === 'count') return Number(value);\n  return value;\n});\nconsole.log(obj.date.getFullYear()); // 2024\nconsole.log(typeof obj.count);       // number

JSON serialisieren: JSON.stringify()

Der umgekehrte Prozess – die Umwandlung eines JavaScript-Objekts in einen JSON-String – wird mit JSON.stringify() durchgeführt. Dies ist erforderlich, um Daten an den Server zu senden, in einer Datei zu speichern oder zu protokollieren.

Einfaches Beispiel für die Serialisierung

const user = {\n  name: 'Maria',\n  age: 25,\n  isAdmin: true\n};\nconst json = JSON.stringify(user);\nconsole.log(json);\n// {"name":"Maria","age":25,"isAdmin":true}

Ausgabe formatieren

Die Methode akzeptiert drei Parameter: den Wert, eine Ersetzungsfunktion (oder ein Array von Feldern) und die Anzahl der Leerzeichen für Einrückungen:

const data = {\n  id: 1,\n  title: 'Artikel',\n  tags: ['js', 'json']\n};\n// Mit Einrückungen von 2 Leerzeichen\nconst prettyJson = JSON.stringify(data, null, 2);\nconsole.log(prettyJson);\n/* Ausgabe:\n{\n  "id": 1,\n  "title": "Artikel",\n  "tags": [\n    "js",\n    "json"\n  ]\n}\n*/

Felder filtern

Der zweite Parameter kann ein Array von Schlüsseln sein, die in das Ergebnis aufgenommen werden sollen:

const user = {\n  name: 'Peter',\n  password: 'secret12