Parsen von JSON-Zeichenfolgen in TypeScript

Shuvayan Ghosh Dastidar 30 Januar 2023
  1. Verwenden von JSON.parse() zum Parsen von JSON-Strings in Objekte in TypeScript
  2. Verwendung von Guards für die sichere Konvertierung von JSON-Strings in Objekte in TypeScript
  3. Verwendung des Partial-Schlüsselworts zur Vermeidung von Laufzeitfehlern in TypeScript
Parsen von JSON-Zeichenfolgen in TypeScript

Zeichenfolgen sind ein Kommunikationsmittel über das Internet, und alle Daten werden in einem sehr beliebten Format namens JSON übertragen. Diese JSON-Darstellung der Daten repräsentiert oft ein Objekt oder sogar eine Klasse in TypeScript.

Dieses Tutorial konzentriert sich darauf, wie die JSON-Zeichenfolge sicher in ein TypeScript-Objekt zurückgeparst wird.

Verwenden von JSON.parse() zum Parsen von JSON-Strings in Objekte in TypeScript

Die in JavaScript verwendete Funktion JSON.parse() kann auch in TypeScript verwendet werden, da TypeScript eine Obermenge von JavaScript ist. Die folgende Methode geht jedoch davon aus, dass die in das Objekt zu konvertierende JSON-Zeichenfolge alle erforderlichen Attribute hat, die dem Objekt zugeordnet sind.

Beispielcode:

interface Person {
    name : string;
    age : number;
}

const personString = `{"name" : "david", "age" : 20}`;

const personObj : Person = JSON.parse(personString);
console.log(personObj);

Ausgabe:

{
  "name": "david",
  "age": 20
}

Verwendung von Guards für die sichere Konvertierung von JSON-Strings in Objekte in TypeScript

Benutzerdefinierte Wächter können überprüfen, ob der JSON-String alle oder einige der erforderlichen Eigenschaften enthält, und ihn so nach unmittelbarem Bedarf weiterverarbeiten oder ablehnen.

Beispielcode:

interface Person {
    name : string;
    age : number;
}

function checkPersonType( obj : any ) : obj is Person {
    return 'name' in obj && 'age' in obj;
}

const personString1 = `{"name" : "david"}`;
const personString2 = `{"name" : "david", "age" : 20 }`;
const personObj1 : Person = JSON.parse(personString1);
if ( checkPersonType(personObj1)) {
    console.log(personObj1);
} else {
    console.log(personString1 + ' cannot be parsed');
}

const personObj2 : Person = JSON.parse(personString2);
if ( checkPersonType(personObj2)) {
    console.log(personObj2);
} else {
    console.log(personString2 + ' cannot be parsed');
}

Ausgabe:

"{"name" : "david"} cannot be parsed"
{
  "name": "david",
  "age": 20
}

Verwendung des Partial-Schlüsselworts zur Vermeidung von Laufzeitfehlern in TypeScript

Einige Felder fehlen möglicherweise in der JSON-Zeichenfolge. In diesem Fall können die Attribute im Objekt mit einigen Standardwerten gefüllt werden.

Das Schlüsselwort Partial in TypeScript hilft uns dabei, indem es alle Attribute im Objekt optional macht und somit mit einem Nullprüfoperator verkettet werden kann, um Standardwerte festzulegen.

Beispielcode:

interface Person {
    name : string;
    age : number;
}

const personString = `{"name" : "david"}`;

const personObj : Partial<Person> = JSON.parse(personString);
console.log(personObj);

console.log( personObj.age ?? 30);

Ausgabe:

{
  "name": "david"
}
30

Obwohl der JSON-String also nicht das Attribut age hat, wie es von der Person-Schnittstelle verlangt wird, wird die Nullprüfung oder ?? Operator wird verwendet, um einen Standardwert für das Attribut Alter zu haben.

Shuvayan Ghosh Dastidar avatar Shuvayan Ghosh Dastidar avatar

Shuvayan is a professional software developer with an avid interest in all kinds of technology and programming languages. He loves all kinds of problem solving and writing about his experiences.

LinkedIn Website