🏠 Accueil ◀️ TP Précédent TP Suivant ▶️

TP5A - Format JSON

JavaScript Object Notation

Qu'est-ce que JSON ?

JSON (JavaScript Object Notation) est un format d'échange de données léger et lisible par les humains.

Il est couramment utilisé pour transmettre des données entre un serveur et une application web.

1. JSON.stringify() - Convertir en JSON

Le JSON apparaîtra ici...

2. JSON.parse() - Convertir depuis JSON

Les données parsées apparaîtront ici...

3. Manipulation d'objets JSON

Résultat de la manipulation...

4. Tableau JSON

JavaScript
// Exemple d'objet JavaScript
const etudiant = {
    nom: "Kacper MOMOT",
    age: 18,
    formation: "Licence cyber",
    matieres: ["HTML", "CSS", "JavaScript", "PHP"],
    notes: {
        html: 16,
        css: 18,
        javascript: 15,
        php: 17
    },
    actif: true
};

// 1. Convertir en JSON (stringify)
const jsonString = JSON.stringify(etudiant, null, 2);
console.log(jsonString);
// Résultat: chaîne JSON formatée

// 2. Convertir depuis JSON (parse)
const jsonData = '{"nom":"Alice","age":22,"formation":"Cybersécurité"}';
const objetJS = JSON.parse(jsonData);
console.log(objetJS.nom); // "Alice"

// 3. Manipulation
const etudiants = [
    { nom: "Kacper", age: 20 },
    { nom: "Alice", age: 22 },
    { nom: "Bob", age: 21 }
];

// Ajouter un étudiant
etudiants.push({ nom: "Charlie", age: 23 });

// Filtrer les étudiants
const etudiantsMajeurs = etudiants.filter(e => e.age >= 18);

// Transformer en tableau de noms
const noms = etudiants.map(e => e.nom);

Structure JSON valide :

JSON
{
  "nom": "Kacper",
  "age": 18,
  "estEtudiant": true,
  "cours": ["HTML", "CSS", "JavaScript"],
  "adresse": {
    "rue": "10 avenu jules guesde",
    "ville": "Le blanc mesnil",
    "pays": "France"
  },
  "contact": {
    "email": "kacper.momot@etu.cyu.com",
    "telephone": "+33762709906"
  },
  "hobbies": ["Programmation", "Lecture", "Sport"],
  "scores": [85, 92, 78, 95],
  "nullValue": null,
  "nombreDecimal": 12.5
}

Règles JSON :

Règle Description Exemple
Guillemets doubles Toutes les clés doivent être entre guillemets doubles "nom" et non 'nom'
Types de valeurs String, Number, Boolean, Array, Object, null "texte", 123, true, [], {}, null
Pas de fonctions JSON ne peut pas contenir de fonctions Non valide: "function": "() => {}"
Pas de commentaires JSON ne supporte pas les commentaires Pas de // ou /* */
Virgule finale Pas de virgule après le dernier élément { "a": 1, "b": 2 } ✓