Les objets littéraux : propriétés et méthodes

Chapitre 9 — Les objets littéraux, JSON et les collections · Les objets littéraux : propriétés et méthodes

1. Regrouper des données

Un tableau range des valeurs numérotées. Pour décrire une chose qui a plusieurs caractéristiques (un stagiaire, un produit, un contact), on utilise un objet: un ensemble de propriétés, chacune formée d'une clé (un nom) et d'une valeur. L'écriture entre accolades s'appelle un objet littéral.

Figure 1 — Clés, valeurs, objet imbriqué, méthode et accès aux propriétés.

2. Créer et manipuler un objet

// 1. Créer un objet littéral : des paires clé : valeur entre accolades
const stagiaire = {
  nom: "Amina Tazi",
  age: 19,
  groupe: "DEV101",
  notes: [14, 16.5, 12],
  adresse: { ville: "Casablanca", codePostal: "20250" },
  "date-inscription": "2026-09-07",          // clé avec un tiret : guillemets obligatoires
};
console.log(stagiaire.nom, "|", stagiaire.adresse.ville, "|", stagiaire.notes[1]);

// 2. Notation pointée ou crochets
console.log(stagiaire["date-inscription"]);
const champ = "groupe";
console.log(`stagiaire[champ] = ${stagiaire[champ]}`);      // clé contenue dans une variable
console.log("Propriété absente :", stagiaire.telephone);

// 3. Ajouter, modifier, supprimer
stagiaire.email = "amina@ista.ma";
stagiaire.age = 20;
delete stagiaire["date-inscription"];
console.log("Clés :", Object.keys(stagiaire).join(", "));

// 4. Tester l'existence d'une propriété
console.log("'email' in stagiaire ?", "email" in stagiaire, "| Object.hasOwn(stagiaire, 'tel') ?", Object.hasOwn(stagiaire, "tel"));

// 5. Des méthodes : des fonctions rangées dans l'objet
const compte = {
  titulaire: "Karim",
  solde: 500,
  deposer(montant) {             // syntaxe courte des méthodes
    this.solde += montant;       // this = l'objet sur lequel on appelle la méthode
    return this.solde;
  },
  resume() {
    return `${this.titulaire} : ${this.solde} DH`;
  },
};
compte.deposer(250);
console.log(compte.resume());

// 6. Raccourcis ES6 : propriétés abrégées et clés calculées
const nom = "Salma", note = 17, matiere = "javascript";
const fiche = { nom, note, [`note_${matiere}`]: note };
console.log(fiche);

// 7. Un objet est une référence
const copie = stagiaire;
copie.age = 99;
console.log("stagiaire.age après modification de copie :", stagiaire.age);
const a = { x: 1 }, b = { x: 1 };
console.log("{ x: 1 } === { x: 1 } ?", a === b);

// 8. Chaînage optionnel pour une propriété peut-être absente
console.log("Ville du tuteur :", stagiaire.tuteur?.adresse?.ville ?? "non renseignée");

Résultat dans la console

Amina Tazi | Casablanca | 16.5
2026-09-07
stagiaire[champ] = DEV101
Propriété absente : undefined
Clés : nom, age, groupe, notes, adresse, email
'email' in stagiaire ? true | Object.hasOwn(stagiaire, 'tel') ? false
Karim : 750 DH
{ nom: 'Salma', note: 17, note_javascript: 17 }
stagiaire.age après modification de copie : 99
{ x: 1 } === { x: 1 } ? false
Ville du tuteur : non renseignée

• Lire: objet.cle (notation pointée), ou objet["cle"] (crochets) quand la clé contient un tiret ou un espace, ou quand elle est dans une variable. Une propriété absente vaut undefined, sans erreur.
• Ajouter ou modifier: une simple affectation. Supprimer: delete objet.cle.
• Tester: "cle" in objet ou Object.hasOwn(objet, "cle"). Ne testez pas objet.cle !== undefined: une propriété peut exister et valoir undefined.
• Méthodes: une fonction rangée dans l'objet. Dans une méthode, this désigne l'objet sur lequel on l'appelle (compte.deposer() → this = compte). Écrivez-la avec la syntaxe courte deposer(montant) { … }, pas avec une fonction fléchée (leçon 10.5).
• Raccourcis: { nom, note } équivaut à { nom: nom, note: note }; [expression]: valeur calcule le nom de la clé.
• Chaînage optionnel: stagiaire.tuteur?.adresse?.ville renvoie undefined au lieu de provoquer une erreur si une étape manque.

3. Un objet est une référence

Figure 2 — Une affectation ne copie pas l'objet : les deux variables désignent le même.

Une variable ne contient pas l'objet lui-même mais une référence vers lui. const copie = stagiaire crée un second nom pour le même objet : modifier copie.age modifie stagiaire.age. C'est aussi pourquoi const n'empêche pas de modifier les propriétés : il interdit seulement de faire pointer la variable vers un autre objet. Pour une vraie copie, voir la leçon 9.4.

Le tableau associatif en JavaScript →