Vérification de null, undefined et des valeurs vides en JavaScript : guide complet

Pourquoi la vérification de null, undefined et des valeurs vides est-elle la douleur de chaque développeur JavaScript ?

Avez-vous déjà pensé : « Pourquoi est-ce que j'écris encore cette construction lourde avec if (x !== null && x !== undefined && x !== '') ? » Si oui, vous n'êtes pas seul. La question « Is there a standard function to check for null, undefined, or blank variables in JavaScript? » sur Stack Overflow a recueilli des milliers de vues. Et ce n'est pas un hasard.

JavaScript n'a pas de fonction intégrée qui vérifie tout en une seule fois. Mais cela ne signifie pas que nous sommes condamnés à souffrir. Dans cet article, nous allons comprendre pourquoi cette fonction n'existe pas, comment contourner élégamment cette limitation, et écrire notre propre helper idéal.

Prêts à transformer le chaos des vérifications en code propre et compréhensible ? C'est parti !

Que sont null, undefined et blank (chaîne vide) en JavaScript ?

Avant de chercher la « pilule magique », comprenons de quoi nous parlons. Ces trois concepts sont trois bêtes différentes, et les confondre est dangereux.

\n
• undefined — la variable est déclarée, mais aucune valeur ne lui a été assignée. C'est la « valeur par défaut » de JavaScript.
\n
• null — la variable existe, mais on lui a intentionnellement assigné « rien ». C'est un choix conscient du développeur.
\n
• blank (chaîne vide) — '' ou "". La chaîne existe, mais elle ne contient aucun caractère.
\n

La différence clé : null est un objet (oui, c'est un bug historique de JS devenu une fonctionnalité), undefined est un type spécial, et la chaîne vide est une chaîne.

let a; // undefined\nlet b = null; // null\nlet c = ''; // chaîne vide (blank)\nconsole.log(typeof a); // "undefined"\nconsole.log(typeof b); // "object" (oui, c'est bien le cas !)\nconsole.log(typeof c); // "string"

Imaginez maintenant : vous voulez vérifier qu'une variable est « vide » dans tous les sens. La vérification habituelle if (!value) fonctionnera pour null et undefined, mais ne prendra-t-elle pas en compte la chaîne vide ? Si, elle le fera ! Parce qu'une chaîne vide est une valeur falsy. Mais il y a un piège...

Pourquoi simplement if (!value) est une mauvaise idée ?

Oui, if (!value) attrapera null, undefined, '', 0, false et NaN. Mais que faire si 0 ou false sont des valeurs valides pour votre variable ? Par exemple, si vous vérifiez la quantité d'articles dans un panier, 0 est normal, ce n'est pas du « vide ».

function processOrder(itemCount) {\n    if (!itemCount) {\n        console.log('Erreur : aucun article !');\n    } else {\n        console.log('Traitement de la commande...');\n    }\n}\nprocessOrder(0); // Erreur : aucun article ! — Ce n'est pas une erreur, c'est 0 article

C'est pourquoi nous avons besoin d'une fonction spécialisée, et non d'une vérification universelle de « véracité ».

Une fonction standard ? Non, mais il existe des modèles standard

À la question « Is there a standard function? », la réponse est non. Mais JavaScript offre des outils flexibles pour que vous puissiez écrire la vôtre. Et c'est même mieux, car votre fonction correspondra exactement à vos besoins métier.

Option 1 : Vérification la plus simple (stricte)

Si vous devez vérifier uniquement null et undefined — utilisez la comparaison stricte (===). C'est la méthode la plus sûre.

function isNullOrUndefined(value) {\n    return value === null || value === undefined;\n}\n\nconsole.log(isNullOrUndefined(null)); // true\nconsole.log(isNullOrUndefined(undefined)); // true\nconsole.log(isNullOrUndefined('')); // false\nconsole.log(isNullOrUndefined(0)); // false

Avantage : ne confond pas 0 et la chaîne vide avec « rien ». Inconvénient : ne vérifie pas le vide