Objets et références

Objectifs

À la fin de cette leçon, vous saurez :

• expliquer pourquoi modifier b change aussi a quand ils partagent un objet ;
• tester l'identité de deux objets avec === ;
• distinguer mutation et réaffectation ;
• appliquer la même logique aux tableaux.

🔗 Pour vous rafraîchir la mémoire : la copie par valeur des primitives

L'observation qui surprend

const a = { name: "Paul" };
const b = a;

b.name = "Jean";

console.log(a.name);   // "Jean"

On n'a modifié que b… et pourtant a a changé. Ce comportement n'est pas un bug : c'est le cœur du modèle mémoire de JavaScript.

La variable ne contient pas l'objet

Un objet est trop gros pour tenir dans une variable : il vit ailleurs, dans une zone de mémoire appelée tas (heap). La variable contient seulement son adresse, qu'on appelle une référence.

a → (référence) ─┐
                 ├─→ { name: "Jean" }   (un seul objet en mémoire)
b → (référence) ─┘

const b = a copie la référence, pas l'objet. Les deux variables désignent donc le même objet : toute mutation par l'un est visible par l'autre.

Mutation vs réaffectation

Deux opérations très différentes :

const user = { name: "Paul" };

user.name = "Jean";      // MUTATION : on modifie l'objet pointé
user = {};               // TypeError : réaffectation interdite par const

• const empêche de changer la référence (réaffecter), mais n'empêche pas de modifier l'objet référencé.
• C'est exactement ce que fait push sur un tableau déclaré const :

const notes = [12];
notes.push(15);          // autorisé : mutation du tableau existant
notes = [];              // TypeError : nouvelle référence refusée

Tester l'identité

L'égalité stricte compare les références, jamais le contenu des objets :

const x = { name: "Paul" };
const y = x;
const z = { name: "Paul" };

console.log(x === y);   // true  : même objet
console.log(x === z);   // false : deux objets différents au contenu identique

Pour comparer des contenus, il faut comparer propriété par propriété (ou passer par une sérialisation — avec prudence). Il n'existe pas d'égalité profonde native.

Le même mécanisme partout

Tableaux, fonctions, dates : tout ce qui n'est pas primitif suit cette règle.

const original = [1, 2, 3];
const alias = original;

alias.push(4);

console.log(original.length);   // 4 : un seul tableau derrière deux noms

Exercice

Pour chaque extrait, prédisez puis vérifiez :

const config = { theme: "sombre" };
const prefs = config;
prefs.theme = "clair";
console.log(config.theme);

const u1 = { id: 1 };
const u2 = { id: 1 };
console.log(u1 === u2);
console.log(u1.id === u2.id);

let liste = ["a"];
let autreListe = liste;
autreListe = ["b"];        // réaffectation !
console.log(liste[0]);

4. Écrivez une fonction memeObjet(a, b) qui renvoie true si les deux paramètres désignent le même objet (pas le même contenu).

5. Expliquez pourquoi const + push ne pose aucun problème, alors que liste = [] en pose un.

Résumé

• Une variable d'objet contient une référence (une adresse), pas l'objet lui-même.
• Copier la référence, c'est partager l'objet : les mutations sont visibles par tous.
• === compare des références : deux objets au contenu identique sont différents.
• Mutation ≠ réaffectation ; const bloque la seconde, jamais la première.

function memeObjet(a, b) {
  return a === b;
}