Leçon 8 / 12
Leçon 08 · Partie 2 — Structures de données

Objets

Regrouper des informations liées

Tu veux stocker des infos sur un utilisateur : prénom, nom, âge, email. Tu pourrais créer une variable pour chaque info :

JavaScript — sans objet (pas pratique)
const prenom = "Alice";
const nom    = "Dupont";
const age    = 28;
const email  = "alice@exemple.fr";

Vite le bazar. Un objet regroupe toutes ces infos dans une seule variable, sous forme de paires clé → valeur. Comme une fiche de renseignements.

JavaScript — avec un objet
const utilisateur = {
  prenom: "Alice",
  nom:    "Dupont",
  age:    28,
  email:  "alice@exemple.fr",
  actif:  true
};

Les objets s'écrivent avec des accolades { }. Chaque ligne est une propriété : une clé et une valeur séparées par :. Les propriétés sont séparées par des virgules.

Accéder aux propriétés

Deux façons d'accéder à une propriété :

JavaScript
const utilisateur = {
  prenom: "Alice",
  age:    28
};

// Notation pointée (la plus courante)
console.log(utilisateur.prenom); // Alice
console.log(utilisateur.age);    // 28

// Notation avec crochets (utile si la clé est dynamique)
console.log(utilisateur["prenom"]); // Alice

// Template literal avec objet
console.log(`Bonjour, ${utilisateur.prenom} !`); // Bonjour, Alice !

Modifier un objet

JavaScript
const utilisateur = { prenom: "Alice", age: 28 };

// Modifier une propriété existante
utilisateur.age = 29;

// Ajouter une nouvelle propriété
utilisateur.ville = "Paris";

// Supprimer une propriété
delete utilisateur.age;

console.log(utilisateur);
// { prenom: "Alice", ville: "Paris" }

Les méthodes — des fonctions dans un objet

Un objet peut aussi contenir des fonctions. On les appelle des méthodes. Tu en connais déjà : console.log(), tableau.push(). Ce sont des fonctions rattachées à un objet.

JavaScript
const calculatrice = {
  valeur: 0,

  ajouter(n) {
    this.valeur += n;
  },

  afficher() {
    console.log(`Résultat : ${this.valeur}`);
  }
};

calculatrice.ajouter(10);
calculatrice.ajouter(5);
calculatrice.afficher(); // Résultat : 15
💡

this dans une méthode désigne l'objet lui-même. C'est comme dire "moi". this.valeur = "la propriété valeur de cet objet".

Tableaux d'objets

On combine souvent tableaux et objets. Par exemple, une liste d'utilisateurs, de produits ou de messages.

JavaScript
const produits = [
  { nom: "Cahier",    prix: 2.50 },
  { nom: "Stylo",     prix: 0.80 },
  { nom: "Calculette", prix: 12.99 }
];

// Afficher tous les produits
produits.forEach((produit) => {
  console.log(`${produit.nom} — ${produit.prix} €`);
});

// Accéder au premier produit
console.log(produits[0].nom); // Cahier

Essaie dans le playground

Playground — Objets
Sortie
Lance le code avec le bouton ▶ Exécuter
// À retenir
  • Objet = ensemble de propriétés clé: valeur entre { }
  • Accès : objet.propriete ou objet["propriete"]
  • On peut ajouter, modifier, supprimer des propriétés après création
  • Une méthode = une fonction dans un objet (objet.methode())
  • this dans une méthode = l'objet lui-même
  • Tableau d'objets = structure très courante pour les listes de données