typeof! == «non défini» vs! = null

Je vois souvent du code JavaScript qui vérifie les paramètres non définis, etc. de cette façon:

if (typeof input !== "undefined") {
    // do stuff
}

Cela semble un peu inutile, car cela implique à la fois une recherche de type et une comparaison de chaînes, sans parler de sa verbosité. Il est nécessaire car il undefinedpourrait être renommé.

Ma question est:
comment ce code est-il meilleur que cette approche:

if (null != input) {
    // do stuff
}

Pour autant que je sache, vous ne pouvez pas redéfinir null, donc ça ne va pas se casser de façon inattendue. Et, en raison de la coercition de type de l' !=opérateur, cela vérifie les deux undefinedet null... qui est souvent exactement ce que vous voulez (par exemple pour les paramètres de fonction facultatifs).

Pourtant, ce formulaire ne semble pas répandu, et il fait même que JSLint vous crie pour avoir utilisé l' !=opérateur maléfique .

Pourquoi est-ce considéré comme un mauvais style?

typeof est plus sûr car il permet à l'identifiant de ne jamais avoir été déclaré auparavant:

if(typeof neverDeclared === "undefined") // no errors

if(neverDeclared === null) // throws ReferenceError: neverDeclared is not defined

Si la variable est déclarée (soit avec le varmot - clé, comme argument de fonction, soit comme variable globale), je pense que la meilleure façon de le faire est:

if (my_variable === undefined)

jQuery le fait, donc c'est assez bon pour moi :-)

Sinon, vous devrez utiliser typeofpour éviter a ReferenceError.

Si vous vous attendez à ce que undefined soit redéfini, vous pouvez envelopper votre code comme ceci:

(function(undefined){
    // undefined is now what it's supposed to be
})();

Ou obtenez-le via l' voidopérateur:

const undefined = void 0;
// also safe

bonne façon:

if(typeof neverDeclared == "undefined") //no errors

Mais le meilleur moyen est de vérifier via:

if(typeof neverDeclared === typeof undefined) //also no errors and no strings

Vous ne devriez pas vraiment vous soucier de renommer undefined. Si quelqu'un renomme indéfini, vous aurez beaucoup plus de problèmes que quelques-uns si les contrôles échouent. Si vous voulez vraiment protéger votre code, enveloppez-le dans une IFFE (expression de fonction immédiatement invoquée) comme ceci:

(function($, Backbone, _, undefined) {
    //undefined is undefined here.
})(jQuery, Backbone, _);

Si vous travaillez avec des variables globales (ce qui est déjà faux) dans un environnement de navigateur, je vérifierais pour undefined comme ceci:

if(window.neverDefined === undefined) {
    //Code works
}

Étant donné que les variables globales font partie de l'objet fenêtre, vous pouvez simplement vérifier par non défini au lieu de transtyper en chaîne et de comparer des chaînes.

En plus de cela, pourquoi vos variables ne sont-elles pas définies? J'ai vu beaucoup de code où ils vérifient l'existence d'une variable et effectuent une action basée sur cela. Pas une seule fois je n'ai vu où cette approche était correcte.

Si vous êtes vraiment inquiet de la redéfinition d'undefined, vous pouvez vous protéger contre cela avec une méthode d'assistance comme celle-ci:

function is_undefined(value) {
   var undefined_check; // instantiate a new variable which gets initialized to the real undefined value
   return value === undefined_check;
}

Cela fonctionne parce que lorsque quelqu'un écrit, undefined = "foo"il ne laisse que le nom faire undefined référence à une nouvelle valeur, mais il ne change pas la valeur réelle de undefined.

Vous pouvez également utiliser l'opérateur void pour obtenir une valeur non définie:

if (input !== void 0) {
    // do stuff    
}

(Et oui, comme indiqué dans une autre réponse, cela générera une erreur si la variable n'a pas été déclarée, mais ce cas peut souvent être exclu soit par inspection de code, soit par refactorisation de code, par exemple en utilisant window.input !== void 0pour tester des variables globales ou en ajoutant var input.)

J'ai en fait rencontré si (typeof input !== 'undefined')dans ce scénario où il est utilisé pour fournir des paramètres de fonction par défaut:

function greet(name, greeting) {
  name = (typeof name !== 'undefined') ?  name : 'Student';
  greeting = (typeof greeting !== 'undefined') ?  greeting : 'Welcome';

  return `${greeting} ${name}!`;
}

greet(); // Welcome Student!
greet('James'); // Welcome James!
greet('Richard', 'Howdy'); // Howdy Richard!

ES6 propose de nouvelles façons d'introduire les paramètres de fonction par défaut de cette façon:

function greet(name = 'Student', greeting = 'Welcome') {
  return `${greeting} ${name}!`;
}

greet(); // Welcome Student!
greet('James'); // Welcome James!
greet('Richard', 'Howdy'); // Howdy Richard!

C'est moins verbeux et plus propre que la première option.

if (input == undefined) { ... }

fonctionne très bien. Ce n'est bien sûr pas une nullcomparaison, mais je trouve généralement que si j'ai besoin de distinguer entre undefinedet null, j'ai plutôt besoin de distinguer entre undefinedet n'importe quelle valeur fausse, donc

else if (input) { ... }

le fait.

Si un programme redéfinit, undefinedil est vraiment braindead de toute façon.

La seule raison pour laquelle je peux penser était pour la compatibilité IE4, il ne comprenait pas le undefinedmot - clé (qui n'est pas réellement un mot-clé, malheureusement), mais bien sûr les valeurs pouvaient l' être undefined , donc vous deviez avoir ceci:

var undefined;

et la comparaison ci-dessus fonctionnerait très bien.

Dans votre deuxième exemple, vous avez probablement besoin de doubles parenthèses pour faire plaisir aux peluches?