Chargement...

null et undefined

Vous connaissez les booléens — un oui ou non clair. Un programme doit aussi parfois dire « il n’y a pas de valeur ici. » JavaScript propose deux vides courants : undefined et null. Ils se ressemblent, mais chaque histoire est différente. Ici on les sépare pour que les conversions et les tests plus tard restent clairs.

Quelle est la différence entre null et undefined ?

undefined signifie souvent « rien n’a encore été mis » — une variable déclarée avec let sans affectation, ou une pièce manquante. null signifie « vide volontaire » : vous (ou une API) assignez null pour vider un emplacement. Vérifiez avec typeof : typeof undefined donne "undefined", mais typeof null est la bizarrerie ancienne "object". Préférez === pour comparer. Les deux sont falsy, sans être des booléens (true / false).

Boîte à outils des valeurs vides

📊 null contre undefined pour débutants

Idée Exemple Résultat / note
Manquant / non assigné let x; puis x undefined
Vide volontaire let box = null vous choisissez le vide
typeof manquant typeof undefined "undefined"
typeof vide typeof null "object" (bizarrerie — signifie toujours vide)
Comparaison stricte box === null true si box contient null
Comparaison souple null == undefined true avec == — préférez === pour la clarté

undefined — pas encore assigné

Déclarez un nom avec let sans rien assigner. La valeur est undefined. Affichez la valeur et typeof pour ancrer l’étiquette "undefined".

undefined par défaut

javascript
let nickname;
console.log(nickname);
console.log(typeof nickname);

null — vide volontaire

Assignez null quand vous voulez signaler clairement « pas de valeur ». Ce n’est pas la même chose qu’oublier l’affectation.

assigner null volontairement

javascript
let selected = null;
console.log(selected);
console.log(typeof selected);

typeof côte à côte

Placez les deux résultats ensemble. Souvenez-vous : typeof null affichant "object" est une bizarrerie, pas encore un cours complet sur les objets.

typeof pour undefined et null

javascript
console.log(typeof undefined);
console.log(typeof null);
let a;
let b = null;
console.log(typeof a);
console.log(typeof b);

Préférez === pour null et undefined

=== demande la même valeur et le même type. Utilisez-le pour « exactement null » ou « exactement undefined ». Avec ==, null et undefined peuvent se correspondre — facile à mal lire en apprenant.

tests stricts avec ===

javascript
let user = null;
let title;
console.log(user === null);
console.log(title === undefined);
console.log(user === undefined);

== souple peut les confondre

Avec ==, null et undefined se correspondent. Affichez-le une fois — puis gardez les vrais tests sur ===.

== souple entre null et undefined

javascript
console.log(null == undefined);
console.log(null === undefined);

La première ligne vaut true car == est souple. La seconde est false. Écrivez vos vrais tests avec === pour garder l’intention claire.

Afficher les deux vides sur la page

Gardez un nom façon undefined et un autre avec null, puis écrivez de courtes étiquettes avec textContent.

Étiquettes de page pour null et undefined

html
<!DOCTYPE html>
<html>
<head>
<title>null and undefined — labels</title>
</head>
<body>
<p id="out">…</p>
<script>
let title;
let avatar = null;
document.getElementById("out").textContent =
"title=" + title + " | avatar=" + avatar;
</script>
</body>
</html>

Le paragraphe montre les deux vides sur une ligne. Changez seulement avatar en une courte chaîne, actualisez, et vérifiez que la moitié droite change tandis que title reste undefined.

À vous d’essayer

  1. Déclarez let city; — affichez city et typeof city sans assignation.
  2. Posez let bag = null; — affichez la valeur et typeof bag (attendez la bizarrerie "object").
  3. Affichez typeof undefined et typeof null ensemble pour voir le contraste.
  4. Comparez avec === : une variable null face à null et face à undefined.
  5. Affichez une fois null == undefined, puis écrivez vos vrais tests avec ===.
  6. Dans la démo HTML, mettez avatar à "pic.png", actualisez et lisez la nouvelle ligne.

Erreurs fréquentes

  • Traiter null et undefined comme toujours interchangeables — le sens diffère (volontaire vs non assigné)
  • Paniquer quand typeof null vaut "object" — bizarrerie ; null reste un vide volontaire
  • S’appuyer sur == entre eux sans voir la correspondance souple
  • Les appeler booléens — ce sont des vides ; les booléens sont seulement true / false
  • Confondre la chaîne vide "" avec null — "" reste du texte

Résumé

  • undefined : manquant / pas encore assigné ; typeof → "undefined"
  • null : vide volontaire que vous assignez ; typeof → "object" (bizarrerie)
  • Préférez === pour des tests clairs ; les deux sont falsy mais pas booléens
  • La chaîne vide "" est du texte — pas la même chose que null ou undefined
  • Suite : conversion de types — transformer volontairement une valeur d’un genre en un autre

🧠 Testez Vos Connaissances

Prêt à Commencer

Testez Vos Connaissances

Mettez-vous au défi avec ce quiz interactif et voyez à quel point vous comprenez le sujet

❓
8
Questions
🎯
70%
Pour Réussir
♾️
∞
Temps
🔄
∞
Tentatives

📝 Instructions

  • Lisez chaque question attentivement
  • Sélectionnez la meilleure réponse pour chaque question
  • Vous pouvez refaire le quiz autant de fois que vous le souhaitez
  • Votre progression sera affichée en haut