JSON.stringify()

Die Methode JSON.stringify() gehört zu den fundamentalen Werkzeugen in JavaScript, um komplexe Datenstrukturen in ein leichtgewichtiges, textbasiertes Format zu überführen. Sie ermöglicht die Umwandlung von JavaScript-Objekten in valide JSON-Strings, wie sie für Netzwerkkommunikation (z.B. mit fetch), lokale Speicherung (localStorage) oder das Debugging von Daten notwendig sind.

Die Methode nimmt ein JavaScript-Objekt oder einen anderen Wert (wie Arrays, Zahlen, Booleans, usw.) und wandelt diesen in einen JSON-String um. Im JSON-String-Format können nur bestimmte Datentypen dargestellt werden.

Objekte: Die Objektstruktur wird in Schlüssel-Wert-Paare umgewandelt.
Arrays: Arrays werden als JSON-Array serialisiert.
Primitive Typen: Nummern, Strings, Booleans werden als einfache Werte dargestellt.
Spezielle Werte: null bleibt null.
Nicht darstellbare Typen: Funktionen, Symbole und undefined werden beim Serialisieren ignoriert bzw. entfernt.

Syntax

            Syntax
        
JSON.stringify(value)
JSON.stringify(value, replacer)
JSON.stringify(value, replacer, space)

Parameter

value

Der Wert, der in einem JSON-String umgewandelt wird.

replacer

(Optional) Eine Funktion oder ein Array, das bestimmt, wie die Umwandlung stattfinden soll (filtert Eigenschaften oder modifiert Werte während der Serialisierung)

space

(Optional) Ein Wert, der zur Formatierung des resultierenden JSON-Strings dient, um z.B. Einrückungen zur besseren Lesbarkeit hinzuzufügen.

Beispiele

Beispiel - Umwandlung eines Objekts

            Beispiel
        
const person = {
    name: "John",
    age: 30,
    isStudent: false,
    hobbies: ["Coding", "Reading", "Music"]
};

const jsonString = JSON.stringify(person);
console.log(jsonString);
{"name":"John","age":30,"isStudent":false,"hobbies":["Coding","Reading","Music"]}

Beispiel - Umwandlung eines Arrays

            Beispiel
        
const nums = [1, 2, 3, 4];
const jsonNums = JSON.stringify(nums);
console.log(jsonNums);
[1,2,3,4]

Ein Array wird einfach als JSON-Array dargestellt.

Beispiel - Umgang mit speziellen Werten

            Beispiel
        
const example = {
    name: "John",
    age: 30,
    sayHello: function() { return "Hello"; },
    favoriteColor: undefined
};

console.log(JSON.stringify(example));
{"name":"John","age":30}

Die Funktion sayHello und die Eigenschaft favoriteColor wurden entfernt, da JSON diese nicht darstellen kann.

Parameter: `replacer`

Der zweite Parameter der Methode ist der replacer. Er kann entweder ein Array oder eine Funktion sein, die bestimmt, welche Eigenschaften im endgültigen JSON-String enthalten sein sollen.

Beispiel - Replacer als Array

Mit einem Array kann man bestimmte Schlüssel explizit angeben, die in den JSON-String aufgenommen werden sollen.

            Beispiel
        
const person = {
    name: "John",
    age: 30,
    city: "Berlin",
    profession: "Developer"
};

const jsonString = JSON.stringify(person, ["name", "city"]);
console.log(jsonString);
{"name":"John","city":"Berlin"}

In diesem Beispiel enthält der JSON-String nur die Eigenschaften name und city, weil sie im replacer Array angegeben sind.

Beispiel - Replacer als Funktion

Mit einer Funktion kann man benutzerdefinierte Logik implementieren, um die Werte der Serialisierung zu verändern.

            Beispiel
        
const person = {
    name: "John",
    age: 30,
    city: "Berlin"
};

const jsonString = JSON.stringify(person, (key, value) => {
    if (typeof value === "string") {
        return value.toUpperCase();
    }
    return value;
});

console.log(jsonString);
{"name":"JOHN","age":30,"city":"BERLIN"}

Parameter: `space`

Der dritte Parameter space dient der Formatierung des JSON-Strings. Er erlaubt es, Einrückungen oder andere Abstände hinzuzufügen, um den String leichter lesbar zu machen.

Beispiel - Einrückung durch Leerzeichen

Man kann eine Anzahl von Leerzeichen als Einrückung angeben.

            Beispiel
        
const person = {
    name: "John",
    age: 30,
    city: "Berlin"
};

const jsonString = JSON.stringify(person, null, 2);
console.log(jsonString);
{
    "name": "John",
    "age": 30,
    "city": "Berlin"
}

Hier wird der JSON-String mit zwei Leerzeichen pro Ebene eingerückt.

Beispiel - Einrückung durch ein Zeichen

Anstelle von Leerzeichen kann man auch andere Zeichen zur Formatierung verwenden, wie zum Beispiel einen Tab.

            Beispiel
        
const person = {
    name: "John",
    age: 30,
    city: "Berlin"
};

const jsonString = JSON.stringify(person, null, "\t");
console.log(jsonString);
{
    "name": "John",
    "age": 30,
    "city": "Berlin"
}

navigation Navigation