JavaScript vérifiant la valeur nulle par rapport à non définie et la différence entre == et ===

579
  1. Comment vérifier une variable si c'est nullou undefinedet quelle est la différence entre le nullet undefined?

  2. Quelle est la différence entre ==et ===(il est difficile de rechercher sur Google "===")?

MUG4N
la source
10
2. La différence entre ==et ===est bien décrite ici .
Uzbekjon
1. Utilisez === au lieu de == JavaScript utilise deux types différents d'opérateurs d'égalité: === | ! == et == | ! = Il est considéré comme la meilleure pratique de toujours utiliser l'ancien ensemble lors de la comparaison. "Si deux opérandes sont du même type et de la même valeur, alors === produit vrai et! == produit faux." - JavaScript: les bonnes parties Cependant, lorsque vous travaillez avec == et! =, Vous rencontrerez des problèmes lorsque vous travaillerez avec différents types. Dans ces cas, ils essaieront de forcer les valeurs, sans succès. code.tutsplus.com/tutorials/…
jasonleonhard
4
Vous pouvez rechercher sur Google: "opérateur d'égalité stricte" - qui récupère des résultats très pertinents
Danield
Juste pour ajouter aux nombreuses réponses ici que vous pouvez utiliser la fonction lodash.com/docs#isNil pour vérifier si la variable est nulle ou non définie
Kfir Erez

Réponses:

936

Comment vérifier une variable si c'est nullou undefined...

La variable est-elle null:

if (a === null)
// or
if (a == null) // but see note below

... mais notez que ce dernier sera également vrai s'il l' aest undefined.

Est-ce undefined:

if (typeof a === "undefined")
// or
if (a === undefined)
// or
if (a == undefined) // but see note below

... mais encore une fois, notez que le dernier est vague; ce sera également vrai si tel aest le cas null.

Maintenant, malgré ce qui précède, la façon habituelle de vérifier ces derniers est d'utiliser le fait qu'ils sont falsey :

if (!a) {
    // `a` is falsey, which includes `undefined` and `null`
    // (and `""`, and `0`, and `NaN`, and [of course] `false`)
}

Ceci est défini par ToBoolean dans la spécification.

... et quelle est la différence entre le nullet undefined?

Ce sont deux valeurs généralement utilisées pour indiquer l'absence de quelque chose. undefinedest la plus générique, utilisée comme valeur par défaut des variables jusqu'à ce qu'elles reçoivent une autre valeur, comme valeur des arguments de fonction qui n'étaient pas fournis lors de l'appel de la fonction, et comme valeur que vous obtenez lorsque vous demandez à un objet pour une propriété qu'il n'a pas. Mais il peut également être explicitement utilisé dans toutes ces situations. (Il y a une différence entre un objet qui n'a pas de propriété et la propriété avec la valeur undefined; il y a une différence entre appeler une fonction avec la valeur undefinedd'un argument et laisser cet argument complètement.)

nullest légèrement plus spécifique que undefined: C'est une référence d'objet vide. JavaScript est typé de manière lâche, bien sûr, mais toutes les choses avec lesquelles JavaScript interagit ne sont pas typées de manière lâche. Si une API comme le DOM dans les navigateurs a besoin d'une référence d'objet vide, nous l'utilisons null, non undefined. De même, l' getElementByIdopération du DOM renvoie une référence d'objet - soit une référence valide (si elle a trouvé l'élément DOM), soit null(si ce n'est pas le cas).

Fait intéressant (ou non), ce sont leurs propres types. C'est-à-dire, nullest la seule valeur dans le type Null, et undefinedest la seule valeur dans le type Undefined.

Quelle est la différence entre "==" et "==="

La seule différence entre eux est que ==cela forcera le type à essayer d'obtenir les valeurs correspondantes, et ===ne le fera pas. Ainsi, par exemple, "1" == 1est vrai, car "1"contraint à 1. Mais "1" === 1c'est faux , car les types ne correspondent pas. ( "1" !== 1est vrai.) La première (vraie) étape ===est "Les types d'opérandes sont-ils les mêmes?" et si la réponse est "non", le résultat est false. Si les types sont les mêmes, il fait exactement ce qui ==fait.

La contrainte de type utilise des règles assez complexes et peut avoir des résultats surprenants (par exemple, "" == 0c'est vrai).

Plus dans la spécification:

TJ Crowder
la source
122
Pour distiller la réponse de TJ, === signifie que la valeur ET le type sont les mêmes.
Slappy
13
@Slappy: :-) @ MUG4N: Oui, c'est vrai. if (a) { ... }signifierait «si aest véridique», où «véridique» est une valeur de chaîne non nulle, non nulle, non indéfinie, non fausse et non vide. :-)
TJ Crowder
4
Euh ... est-ce que le downvoter se soucierait de partager des commentaires utiles sur la raison pour laquelle vous pensez que cela n'était "pas utile" (pour citer l'info-bulle du bouton downvote)?
TJ Crowder
2
@ Željko: Je pense que Crockford peut se tromper sur ce point. C'est vrai que ce nulln'est pas un objet , c'est une référence d'objet signifiant "pas d'objet". C'est important, car c'est ce qui est utilisé avec les interfaces fournies par l'hôte quand elles fournissent des références d'objet mais n'en ont pas à fournir (par exemple, node.nextSiblingquand nodeest le dernier élément de son parent, ou getElementByIdquand il n'y a aucun élément avec cet ID). La technologie utilisée par l'hôte pour cela peut ne pas être aussi flexible que JavaScript concerne les types de variable / propriété, il était donc nécessaire d'avoir une nullréférence obj (par opposition à undefined).
TJ Crowder
2
Je dois convenir que Crockford se trompe. typeof nullrenvoyer "objet" a du sens. La seule autre valeur qui aurait du sens serait "null", car elle devrait certainement renvoyer quelque chose de différent de typeof undefined. null représente une référence d'objet null, ce qui, à tout le moins, signifie que la variable qui la contient est destinée à un certain type d '«objet». Si c'était une erreur, c'était une bonne erreur. Quoi qu'il en soit, en ce qui concerne la réponse, l'astuce concernant undefined! == undefinedlors des scripts entre fenêtres est bonne à savoir, en particulier à des fins de débogage.
Triynko
93

La différence est subtile.

En JavaScript, une undefinedvariable est une variable qui n'a jamais été déclarée ou n'a jamais affecté de valeur. Disons que vous déclarez var a;par exemple, ce asera le cas undefined, car aucune valeur ne lui a été affectée.

Mais si vous attribuez a = null;alors, ce asera désormais le cas null. En JavaScript nullest un objet (essayez typeof nulldans une console JavaScript si vous ne me croyez pas), ce qui signifie que null est une valeur (en fait même undefinedest une valeur).

Exemple:

var a;
typeof a;     # => "undefined"

a = null;
typeof null;  # => "object"

Cela peut s'avérer utile dans les arguments de fonction. Vous pouvez vouloir avoir une valeur par défaut, mais considérez null comme acceptable. Dans ce cas, vous pouvez faire:

function doSomething(first, second, optional) {
    if (typeof optional === "undefined") {
        optional = "three";
    }
    // do something
}

Si vous omettez le optionalparamètre doSomething(1, 2) thenfacultatif sera la "three"chaîne mais si vous passez doSomething(1, 2, null)alors facultatif sera null.

Quant aux comparateurs égaux ==et strictement égaux ===, le premier est de type faible, tandis que strictement égal vérifie également le type de valeurs. Cela signifie que 0 == "0"cela reviendra vrai; while 0 === "0"renverra false, car un nombre n'est pas une chaîne.

Vous pouvez utiliser ces opérateurs pour vérifier entre undefinedun null. Par exemple:

null === null            # => true
undefined === undefined  # => true
undefined === null       # => false
undefined == null        # => true

Le dernier cas est intéressant, car il permet de vérifier si une variable est soit indéfinie, soit nulle et rien d'autre:

function test(val) {
    return val == null;
}
test(null);       # => true
test(undefined);  # => true
Julien Portalier
la source
1
Kyle Simpson affirme que typeof null retournant "object" est un bug: github.com/getify/You-Dont-Know-JS/blob/master/…
bzrk
15

La spécification est l'endroit où aller pour obtenir des réponses complètes à ces questions. Voici un résumé:

  1. Pour une variable x, vous pouvez:

    • vérifier si c'est nullpar comparaison directe avec ===. Exemple:x === null
    • vérifier si c'est undefinedpar l'une des deux méthodes de base: comparaison directe avec undefinedou typeof. Pour diverses raisons , je préfère typeof x === "undefined".
    • Vérifiez s'il s'agit de l'une des règles de coercition de type légèrement arcanes nullet undefineden les utilisant ==et en vous appuyant sur elles, ce qui signifie x == nullexactement ce que vous voulez.

  2. La différence fondamentale entre ==et ===est que si les opérandes sont de types différents, ===retournera toujours falsewhile ==convertira un ou les deux opérandes dans le même type en utilisant des règles qui conduisent à un comportement légèrement peu intuitif. Si les opérandes sont du même type (par exemple, les deux sont des chaînes, comme dans la typeofcomparaison ci-dessus), ==et ===se comporteront exactement de la même manière.

Plus de lecture:

Tim Down
la source
9

Comment puis-je vérifier une variable si elle est nulle ou non définie

vérifiez simplement si une variable a une valeur valide comme celle-ci:

if(variable)

il retournera vrai si la variable ne contient pas:

  • nul
  • indéfini
  • 0
  • faux
  • "" (une chaîne vide)
  • NaN
Sumit Joshi
la source
8

indéfini

Cela signifie que la variable n'est pas encore initialisée.

Exemple :

var x;
if(x){ //you can check like this
   //code.
}

est égal à (==)

Il vérifie uniquement que la valeur est égale à pas le type de données.

Exemple :

var x = true;
var y = new Boolean(true);
x == y ; //returns true

Parce qu'il vérifie uniquement la valeur.

Strict Equals (===)

Vérifie que la valeur et le type de données doivent être identiques.

Exemple :

var x = true;
var y = new Boolean(true);
x===y; //returns false.

Parce qu'il vérifie que le type de données x est un type primitif et y est un objet booléen.

kannanrbk
la source
4

L'annonce 1. nulln'est pas un identifiant pour une propriété de l'objet global, comme undefined peut l'être

Annonce 2. Les ===valeurs et types de contrôle. Ils ==ne nécessitent pas les mêmes types et ont effectué une conversion implicite avant la comparaison (en utilisant .valueOf()et .toString()). Ici, vous avez tout ( src ):

si

entrez la description de l'image ici

== (sa négation ! = )

entrez la description de l'image ici

=== (sa négation ! == )

entrez la description de l'image ici

Kamil Kiełczewski
la source
1
il convient de mentionner cela document.all == nulletdocument.all !== null
un utilisateur
1

Si votre vérification (logique) est pour une négation (!) Et que vous souhaitez capturer à la fois JS nullet undefined (comme différents navigateurs vous donneront des résultats différents), vous utiliseriez la comparaison moins restrictive: par exemple:

var ItemID = Item.get_id();
if (ItemID != null)
{
 //do stuff
}

Cela capturera à la fois nulletundefined

DaniDev
la source
0

Essayez avec une logique différente . Vous pouvez utiliser le code ci-dessous pour vérifier les quatre (4) conditions de validation comme non nul, non vide, non indéfini et non nul uniquement utiliser ce code (! (! (Variable))) en javascript et jquery.

function myFunction() {
var data;  //The Values can be like as null, blank, undefined, zero you can test

if(!(!(data)))
{
   //If data has valid value
    alert("data "+data);
} 
else 
{
    //If data has null, blank, undefined, zero etc.
    alert("data is "+data);
}

}

Ravikant
la source