Travailler avec JSON en JavaScript : analyse et sérialisation pour débutants

Introduction à JSON et JavaScript

JSON (JavaScript Object Notation) est un format léger d'échange de données qui est devenu la norme pour l'interaction entre le client et le serveur dans les applications web. Grâce à sa simplicité et sa lisibilité, JSON est utilisé partout : des fichiers de configuration aux requêtes API. Dans cet article, nous allons voir comment travailler avec JSON dans l'environnement Node.js, maîtriser l'analyse (conversion d'une chaîne en objet) et la sérialisation (conversion d'un objet en chaîne). Le contenu est destiné aux développeurs débutants déjà familiers avec les bases de JavaScript.

Qu'est-ce que JSON et pourquoi en a-t-on besoin ?

JSON est un format textuel basé sur la syntaxe des objets JavaScript. Cependant, JSON n'est qu'une chaîne de caractères qui peut être transmise sur un réseau ou stockée dans un fichier. Les principaux types de données en JSON sont :

\n
• Chaînes de caractères (entre guillemets doubles)
\n
• Nombres (entiers et à virgule flottante)
\n
• Valeurs booléennes (true/false)
\n
• null
\n
• Tableaux
\n
• Objets (clés entre guillemets doubles)
\n

Exemple d'une chaîne JSON valide :

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

Contrairement à un objet JavaScript classique, JSON nécessite une syntaxe stricte : toutes les clés et les valeurs de chaînes sont placées entre guillemets doubles, et les commentaires sont interdits.

Analyse JSON : JSON.parse()

Pour convertir une chaîne JSON en objet JavaScript, on utilise la méthode JSON.parse(). Cela est nécessaire lorsque vous recevez des données du serveur, lisez un fichier ou traitez une entrée utilisateur.

Exemple de base d'analyse

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

Analyse d'un tableau

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

Gestion des erreurs d'analyse

Un JSON invalide déclenchera une exception SyntaxError. Utilisez toujours try...catch lorsque vous travaillez avec des données non fiables :

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

Vous pouvez également passer un deuxième argument — une fonction reviver qui permet de transformer les valeurs pendant l'analyse :

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

Sérialisation JSON : JSON.stringify()

Le processus inverse — conversion d'un objet JavaScript en chaîne JSON — est effectué à l'aide de JSON.stringify(). Cela est nécessaire pour envoyer des données au serveur, les sauvegarder dans un fichier ou les journaliser.

Exemple simple de sérialisation

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

Formatage de la sortie

La méthode accepte trois paramètres : la valeur, une fonction de remplacement (ou un tableau de champs) et le nombre d'espaces pour l'indentation :

const data = {\n  id: 1,\n  title: 'Article',\n  tags: ['js', 'json']\n};\n// Avec une indentation de 2 espaces\nconst prettyJson = JSON.stringify(data, null, 2);\nconsole.log(prettyJson);\n/* Sortie :\n{\n  "id": 1,\n  "title": "Article",\n  "tags": [\n    "js",\n    "json"\n  ]\n}\n*/

Filtrage des champs

Le deuxième paramètre peut être un tableau de clés à inclure dans le résultat :

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