typeof! == "undefined" vs.! = null

A menudo veo código JavaScript que comprueba parámetros indefinidos, etc. de esta manera:

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

Esto parece un poco despilfarrador, ya que implica tanto una búsqueda de tipo como una comparación de cadenas, sin mencionar su verbosidad. Sin undefinedembargo, es necesario porque podría renombrarse.

Mi pregunta es:
¿Cómo es ese código mejor que este enfoque?

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

Hasta donde sé, no puedes redefinir null, por lo que no se romperá inesperadamente. Y, debido a la coerción de tipo del !=operador, esto comprueba ambos undefinedy null... que a menudo es exactamente lo que desea (por ejemplo, para parámetros de función opcionales).

Sin embargo, esta forma no parece generalizada e incluso hace que JSLint te grite por usar el !=operador maligno .

¿Por qué esto se considera mal estilo?

typeof es más seguro ya que permite que el identificador nunca se haya declarado antes:

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

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

Si se declara la variable (ya sea con la varpalabra clave, como un argumento de función o como una variable global), creo que la mejor manera de hacerlo es:

if (my_variable === undefined)

jQuery lo hace, así que es lo suficientemente bueno para mí :-)

De lo contrario, tendrá que usar typeofpara evitar a ReferenceError.

Si espera que se redefina lo indefinido, puede ajustar su código de esta manera:

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

O consígalo a través del voidoperador:

const undefined = void 0;
// also safe

Buen camino:

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

Pero la mejor manera es verificar a través de:

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

Realmente no debería preocuparse por un nombre indefinido. Si alguien cambia el nombre de indefinido, tendrá muchos más problemas que unos pocos si los cheques fallan. Si realmente desea proteger su código, envuélvalo en un IFFE (expresión de función invocada inmediatamente) como este:

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

Si está trabajando con variables globales (que ya está mal) en un entorno de navegador, comprobaría si no está definido de esta manera:

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

Dado que las variables globales son parte del objeto de la ventana, simplemente puede verificar contra indefinido en lugar de convertir a una cadena y comparar cadenas.

Además de eso, ¿por qué sus variables no están definidas? He visto una gran cantidad de código en el que verifican la existencia de variables y realizan algunas acciones basadas en eso. Ni una sola vez he visto dónde este enfoque ha sido correcto.

Si está realmente preocupado por la redefinición de lo indefinido, puede protegerse contra esto con algún método auxiliar como este:

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

Esto funciona porque cuando alguien escribe undefined = "foo", solo deja que el nombre undefined haga referencia a un nuevo valor, pero no cambia el valor real de undefined.

También puede usar el operador vacío para obtener un valor indefinido:

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

(Y sí, como se señaló en otra respuesta, esto arrojará un error si la variable no se declaró, pero este caso a menudo se puede descartar mediante inspección de código o refactorización de código, por ejemplo, window.input !== void 0para probar variables globales o agregar var input).

De hecho, me he encontrado si (typeof input !== 'undefined')en este escenario donde se usa para proporcionar parámetros de función predeterminados:

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 proporciona nuevas formas de introducir parámetros de función predeterminados de esta manera:

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

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

Esto es menos detallado y más limpio que la primera opción.

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

funciona bien Por supuesto, no es una nullcomparación, pero generalmente encuentro que si necesito distinguir entre undefinedy null, en realidad prefiero distinguir entre undefinedy cualquier valor falso, entonces

else if (input) { ... }

lo hace.

Si un programa redefine undefined, de todos modos es realmente una muerte mental.

La única razón por la que puedo pensar es por la compatibilidad con IE4, no entendió la undefinedpalabra clave (que en realidad no es una palabra clave, desafortunadamente), pero por supuesto que los valores podrían serlo undefined , por lo que tenía que tener esto:

var undefined;

y la comparación anterior funcionaría bien.

En su segundo ejemplo, ¿probablemente necesite paréntesis dobles para hacer feliz a la pelusa?