Travailler avec JSON en TypeScript : analyse et sérialisation des données

Formateur Python en ligne pour débutants

Apprenez Python facilement sans surcharge théorique. Résolvez des tâches pratiques avec vérification automatique et écrivez du code directement dans le navigateur.

Start Course

Introduction

JSON (JavaScript Object Notation) est un format léger d'échange de données largement utilisé dans le développement web pour transmettre des informations entre le client et le serveur. TypeScript, en tant que sur-ensemble strictement typé de JavaScript, fournit des outils puissants pour travailler avec JSON de manière sécurisée et pratique. Dans cet article, nous examinerons en détail comment effectuer l'analyse et la sérialisation JSON en TypeScript, utiliser les types pour garantir l'exactitude des données et éviter les erreurs typiques.

Un travail correct avec JSON est essentiel pour créer des applications fiables et évolutives. TypeScript permet non seulement de convertir des chaînes JSON en objets et vice versa, mais aussi de garantir que la structure et les types de données correspondent à ceux attendus. Cela est particulièrement utile lors du travail avec des API, des fichiers de configuration et des bases de données.

Fondamentaux de l'analyse JSON en TypeScript

L'analyse JSON est le processus de conversion d'une chaîne JSON en un objet TypeScript. La méthode globale JSON.parse() est utilisée à cette fin. Cependant, contrairement à JavaScript, en TypeScript, nous pouvons spécifier le type attendu du résultat, ce qui rend le code plus prévisible.

Analyse simple sans types

Exemple de base d'analyse d'une chaîne JSON :

const jsonString = '{"name": "Anna", "age": 30, "city": "Moscou"}';
const user = JSON.parse(jsonString);
console.log(user.name); // "Anna"

Dans ce cas, TypeScript déduira le type any pour la variable user, ce qui réduit la sécurité des types. Il est préférable d'utiliser une indication explicite du type.

Analyse avec indication de type via une interface

L'approche la plus correcte consiste à définir une interface et à l'utiliser lors de l'analyse :

interface User {
  name: string;
  age: number;
  city: string;
}

const jsonString = '{"name": "Anna", "age": 30, "city": "Moscou"}';
const user: User = JSON.parse(jsonString);
console.log(user.name); // TypeScript sait que c'est un string

Cette approche permet à l'IDE de fournir l'autocomplétion et de vérifier les types au moment de la compilation.

Gestion des erreurs d'analyse

Les chaînes JSON peuvent être incorrectes, il est donc important de gérer les exceptions :

function safeParseJSON<T>(json: string): T | null {
  try {
    return JSON.parse(json) as T;
  } catch (error) {
    console.error('Erreur d\'analyse JSON :', error);
    return null;
  }
}

const invalidJson = '{"name": "Anna", age: 30}'; // JSON incorrect
const result = safeParseJSON<User>(invalidJson);
if (result) {
  console.log(result.name);
} else {
  console.log('Impossible d\'analyser le JSON');
}

La fonction safeParseJSON accepte un paramètre générique, ce qui permet de la réutiliser pour différents types de données.

Sérialisation d'objets en JSON

La sérialisation est le processus inverse de conversion d'un objet TypeScript en une chaîne JSON. La méthode JSON.stringify() est utilisée à cette fin. TypeScript n'ajoute pas de nouvelles fonctionnalités à cette méthode, mais aide à contrôler quelles données aboutissent dans la chaîne finale.

Sérialisation de base

const user: User = {
  name: "Ivan",
  age: 25,
  city: "Saint-Pétersbourg"
};

const jsonString = JSON.stringify(user);
console.log(jsonString); // {"name":"Ivan","age":25,"city":"Saint-Pétersbourg"}

Utilisation de replacer pour filtrer les champs

Le deuxième paramètre de JSON.stringify() est une fonction replacer qui permet de contrôler quels champs inclure dans le résultat :

const jsonStringFiltered = JSON.stringify(user, (key, value) => {
  if (key === 'age') {
    return undefined; // Exclut le champ age
  }
  return value;
});
console.log(jsonStringFiltered); // {"name":"Ivan","city":"Saint-Pétersbourg"}

C'est utile lorsqu'il faut masquer des données sensibles ou réduire la taille des informations transmises.