Comment vérifier la présence d'une variable indéfinie ou nulle en JavaScript ?

Question

Nous utilisons fréquemment le modèle de code suivant dans notre code JavaScript

if (typeof(some_variable) != 'undefined' && some_variable != null)
{
    // Do something with some_variable
}

Existe-t-il une façon moins verbeuse de vérifier qui a le même effet ?

Selon certains forums et la littérature, dire simplement ce qui suit devrait avoir le même effet.

if (some_variable)
{
    // Do something with some_variable
}

Malheureusement, Firebug évalue une telle déclaration comme une erreur au moment de l'exécution lorsque some_variable est indéfinie, alors que la première lui convient parfaitement. S'agit-il seulement d'un comportement (indésirable) de Firebug ou y a-t-il vraiment une différence entre ces deux méthodes ?

Answer 1

Je pense que la manière la plus efficace de tester la "valeur" est de null o undefined " est

if ( some_variable == null ){
  // some_variable is either null or undefined
}

Ces deux lignes sont donc équivalentes :

if ( typeof(some_variable) !== "undefined" && some_variable !== null ) {}
if ( some_variable != null ) {}

Note 1

Comme mentionné dans la question, la variante courte exige que some_variable a été déclarée, sinon une ReferenceError sera déclenchée. Cependant, dans de nombreux cas d'utilisation, vous pouvez supposer que cela est sûr :

vérifier les arguments optionnels :

function(foo){
    if( foo == null ) {...}

vérifier les propriétés d'un objet existant

if(my_obj.foo == null) {...}

D'autre part typeof peut traiter les variables globales non déclarées (il retourne simplement undefined ). Pourtant, ces cas devraient être réduits au minimum pour de bonnes raisons, comme l'explique Alsciende.

Note 2

Cette variante - encore plus courte - est pas équivalent :

if ( !some_variable ) {
  // some_variable is either null, undefined, 0, NaN, false, or an empty string
}

donc

if ( some_variable ) {
  // we don't get here if some_variable is null, undefined, 0, NaN, false, or ""
}

Note 3

En général, il est recommandé d'utiliser === au lieu de == . La solution proposée est une exception à cette règle. Le site Contrôleur de syntaxe JSHint fournit même le eqnull pour cette raison.

De la Guide de style jQuery :

Les contrôles d'égalité stricts (===) doivent être utilisés au profit de ==. exception est la vérification de la présence d'undefined et de null par le biais de null.

// Check for both undefined and null values, for some important reason. 
undefOrNull == null;

EDIT 2021-03 :

De nos jours, la plupart des navigateurs soutenir le Opérateur de coalescence nul ( ?? ) et le Affectation logique de la nullité (??=) qui permet une manière plus concise d'attribuer une d'attribuer une valeur par défaut si une variable est nulle ou indéfinie, par exemple :

if (a.speed == null) {
  // Set default if null or undefined
  a.speed = 42;
}

peut être écrit sous l'une des formes suivantes

a.speed ??= 42;
a.speed ?? a.speed = 42;
a.speed = a.speed ?? 42;

Answer 2

Il faut différencier les cas :

1. Les variables peuvent être undefined o non déclaré . Vous obtiendrez une erreur si vous accédez à une variable non déclarée dans un contexte autre que typeof .

   if(typeof someUndeclaredVar == whatever) // works if(someUndeclaredVar) // throws error

Une variable qui a été déclarée mais non initialisée est undefined .

let foo;
if (foo) //evaluates to false because foo === undefined

2. Indéfini propriétés comme someExistingObj.someUndefProperty . Une propriété indéfinie ne donne pas lieu à une erreur et renvoie simplement undefined qui, lorsqu'il est converti en booléen, est évalué à false . Donc, si vous ne vous souciez pas de 0 y false en utilisant if(obj.undefProp) c'est bon. Il y a un idiome commun basé sur ce fait :

   value = obj.prop || defaultValue

   ce qui signifie "si obj a la propriété prop et l'affecter à value sinon, attribuez la valeur par défaut defautValue ".

   Certaines personnes considèrent ce comportement comme déroutant, arguant qu'il conduit à des erreurs difficiles à trouver et recommandent d'utiliser la fonction in opérateur à la place

   value = ('prop' in obj) ? obj.prop : defaultValue

Answer 3

Si vous essayez de faire référence à une variable non déclarée, une erreur sera générée dans toutes les implémentations JavaScript.

Les propriétés des objets ne sont pas soumises aux mêmes conditions. Si une propriété d'objet n'a pas été définie, une erreur ne sera pas levée si vous essayez d'y accéder. Donc, dans cette situation, vous pourriez raccourcir :

 if (typeof(myObj.some_property) != "undefined" && myObj.some_property != null)

à

if (myObj.some_property != null)

Ceci étant, et compte tenu du fait que les variables globales sont accessibles en tant que propriétés de l'objet global ( window dans le cas d'un navigateur), vous pouvez utiliser ce qui suit pour les variables globales :

if (window.some_variable != null) {
    // Do something with some_variable
}

Dans les scopes locaux, il est toujours utile de s'assurer que les variables sont déclarées en haut du bloc de code, ce qui permet d'éviter les utilisations récurrentes de la fonction typeof .

Answer 4

Tout d'abord, vous devez être très clair sur ce que vous testez. JavaScript dispose de toutes sortes de conversions implicites qui peuvent vous faire trébucher, et de deux types différents de comparateurs d'égalité : == y === .

Une fonction, test(val) qui teste les null o undefined doit présenter les caractéristiques suivantes :

 test(null)         => true
 test(undefined)    => true
 test(0)            => false
 test(1)            => false
 test(true)         => false
 test(false)        => false
 test('s')          => false
 test([])           => false

Voyons voir quelles sont les idées qui passent notre test.

Ils fonctionnent :

val == null
val === null || val === undefined
typeof(val) == 'undefined' || val == null
typeof(val) === 'undefined' || val === null

Ceux-ci ne fonctionnent pas :

typeof(val) === 'undefined'
!!val

J'ai créé un entrée jsperf pour comparer l'exactitude et les performances de ces approches. Les résultats ne sont pas concluants pour l'instant car il n'y a pas eu assez d'essais sur différents navigateurs/plateformes. Veuillez prendre une minute pour effectuer le test sur votre ordinateur !

À l'heure actuelle, il semble que la simple val == null donne les meilleures performances. C'est aussi le plus court. Le test peut être annulé pour val != null si vous voulez le complément.

Answer 5

Comme il n'existe pas de réponse unique, complète et correcte, je vais essayer de résumer :

En général, l'expression :

if (typeof(variable) != "undefined" && variable != null)

ne peut pas être simplifié, car le variable peut ne pas être déclarée, de sorte que l'omission de l'élément typeof(variable) != "undefined" entraînerait une ReferenceError. Mais, vous pouvez simplifier l'expression en fonction du contexte :

Si le variable est mondial vous pouvez simplifier :

if (window.variable != null)

Si c'est le cas local vous pouvez probablement éviter les situations où cette variable n'est pas déclarée, et aussi simplifier :

if (variable != null)

Si c'est le cas propriété de l'objet vous n'avez pas à vous soucier de ReferenceError :

if (obj.property != null)