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".
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.
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.
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.
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 ===.
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.
<!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
- Déclarez
let city;— affichezcityettypeof citysans assignation. - Posez
let bag = null;— affichez la valeur ettypeof bag(attendez la bizarrerie"object"). - Affichez
typeof undefinedettypeof nullensemble pour voir le contraste. - Comparez avec
===: une variablenullface ànullet face àundefined. - Affichez une fois
null == undefined, puis écrivez vos vrais tests avec===. - Dans la démo HTML, mettez
avatarà"pic.png", actualisez et lisez la nouvelle ligne.
Erreurs fréquentes
- Traiter
nulletundefinedcomme toujours interchangeables — le sens diffère (volontaire vs non assigné) - Paniquer quand
typeof nullvaut"object"— bizarrerie ;nullreste 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
""avecnull—""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 quenullouundefined - Suite : conversion de types — transformer volontairement une valeur d’un genre en un autre
🧠 Testez Vos Connaissances
Testez Vos Connaissances
Mettez-vous au défi avec ce quiz interactif et voyez à quel point vous comprenez le sujet
📝 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