Front-end · 6 mondes · 18 étapes

JavaScript

Le langage du web : types, fonctions, tableaux, objets et asynchrone.

Progression

0 %

0/18 étapes terminées

Intermédiaire · 8 min de lecture

JSON et données absentes

Survivre aux données du monde réel

1Définition

JSON est le texte qui transporte les données entre programmes : JSON.stringify l'écrit, JSON.parse le lit. Les données reçues sont souvent incomplètes : ?. lit sans planter, ?? fournit une valeur par défaut.

2Principes fondamentaux

01

Parser dans un try

JSON.parse lève une erreur sur un texte mal formé : toute donnée extérieure se lit dans un try / catch.

02

?. pour lire

a?.b?.c renvoie undefined au premier maillon absent au lieu de lever une erreur.

03

?? pour compléter

valeur ?? defaut ne remplace que null et undefined — pas 0 ni "", contrairement à ||.

04

Valider à l'entrée

Une donnée vérifiée une fois à l'entrée n'a plus besoin d'être soupçonnée partout ailleurs.

3Exemples pratiques

Une lecture défensive

Exemple
1let joueur;2try {3  joueur = JSON.parse(recu);4} catch {5  joueur = {};6}7 8const ville = joueur.adresse?.ville ?? "inconnue";9const score = joueur.score ?? 0;

Texte illisible, champ manquant, score absent : aucun de ces cas n'arrête le programme.

|| contre ??

Exemple
1const score = 0;2console.log(score || 100);   // 100 : 0 est remplacé à tort3console.log(score ?? 100);   // 0 : 0 est une vraie valeur

Un score nul, une chaîne vide, un booléen faux sont des valeurs légitimes : ?? les respecte.

4Erreurs courantes

Lire sans protection

À éviter

const ville = joueur.adresse.ville;

À faire

const ville = joueur.adresse?.ville ?? "inconnue";

Pourquoi : « Cannot read properties of undefined » : le traitement entier s'arrête pour un champ manquant.

|| pour une valeur par défaut

À éviter

const volume = reglages.volume || 50;

À faire

const volume = reglages.volume ?? 50;

Pourquoi : Un volume à 0 serait remplacé par 50.

Clés entre guillemets simples

À éviter

{'nom': 'codey'}

À faire

{"nom": "codey"}

Pourquoi : JSON n'accepte que les guillemets doubles : JSON.parse refuse la première forme.

5Subtilités à connaître

  • ◆JSON.stringify ignore les fonctions et undefined, et transforme les dates en texte ISO.
  • ◆JSON.stringify(objet, null, 2) indente le résultat : précieux pour déboguer.
  • ◆Les données reçues d'un serveur ne sont jamais fiables : en production, on les valide avec un schéma (Zod, par exemple).

6Vérifie ta compréhension

Question 1/3

Score 0

undefined?.nom vaut…

Envie d'essayer ? Ouvre le Labo et recopie les exemples pour les modifier.