Typeof !==“未定义”;Vs. = null

我经常看到JavaScript代码以这种方式检查未定义的参数等:

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

这似乎有点浪费,因为它涉及类型查找和字符串比较,更不用说它的冗长了。它是必需的,因为undefined可以重命名。

我的问题是:
这段代码比这个方法好到哪里去了:

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

据我所知,你不能重新定义null,所以它不会意外地崩溃。而且,由于!=操作符的类型强制转换,这将检查undefinednull…这通常正是你想要的(例如,对于可选的函数参数)。

然而这种形式似乎并不普遍,它甚至会导致JSLint对你大喊大叫,因为你使用了邪恶的!=操作符。

为什么这被认为是糟糕的风格?

690017 次浏览

typeof更安全,因为它允许标识符之前从未声明过:

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


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

如果你真的担心undefined被重新定义,你可以使用一些helper方法来防止这种情况,像这样:

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

这是可行的,因为当某人编写undefined = "foo"时,他只让的名字 undefined引用一个新值,但他不改变undefined的实际值。

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

工作得很好。这当然不是一个null的比较,但我通常发现,如果我需要区分undefinednull,我实际上更需要区分undefined和任何假值,所以

else if (input) { ... }

它。

如果一个程序重新定义undefined,无论如何它都是真正的脑死亡。

我能想到的唯一原因是IE4兼容性,它不理解undefined关键字(这实际上不是一个关键字,不幸的是),但当然值可以 undefined,所以你必须有这个:

var undefined;

上面的比较就可以了。

在你的第二个例子中,你可能需要双括号来让lint开心?

如果声明了变量(使用var关键字,作为函数参数,或作为全局变量),我认为最好的方法是:

if (my_variable === undefined)

jQuery做到了,所以它对我来说足够好了:-)

否则,你将不得不使用typeof来避免ReferenceError

如果你希望undefined被重新定义,你可以像这样包装你的代码:

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

或者通过void操作符获取:

const undefined = void 0;
// also safe

你也可以使用void操作符来获得一个未定义的值:

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

(是的,正如另一个答案所指出的,如果变量没有声明,这将抛出一个错误,但这种情况通常可以通过代码检查或代码重构来排除,例如使用window.input !== void 0测试全局变量或添加var input。)

你不应该真的担心undefined被重命名。如果有人重命名为undefined,那么您将遇到比检查失败更多的麻烦。如果你真的想保护你的代码,把它包装在IFFE(立即调用的函数表达式)中,就像这样:

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

如果你在浏览器环境中使用全局变量(这已经是错误的),我会像这样检查undefined:

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

由于全局变量是窗口对象的一部分,您可以简单地检查undefined,而不是强制转换为字符串并比较字符串。

最重要的是,为什么变量没有定义?我见过很多代码,它们检查变量是否存在,并基于此执行一些操作。我从未见过这种方法在哪里是正确的。

好的方法:

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

但最好看的方法是通过以下方式查看:

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

实际上,我在这个场景中遇到过if (typeof input !== 'undefined'),它被用于提供默认函数参数:

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提供了引入默认函数参数的新方法:

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


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

这比第一个选项更简洁。

(function(){


var a= b = 3;
var ed = 103;
  

})();






//console.log(ed); //ed is not defined


console.log("a defined? " + (typeof a !== 'undefined')); //no define
console.log("b defined? " + (typeof b !== 'undefined')); //yes define
console.log(typeof(b)); //number
console.log(typeof(4+7));   //number
console.log(b); //3
console.log(typeof("4"+"7")); //string
var e= "ggg";
console.log(typeof(e)); //string
var ty=typeof(b);
console.log(ty); //number
console.log(typeof false); //boolean
console.log(typeof 1); //number
console.log(typeof 0); //number
console.log(typeof true); //boolean




console.log(typeof Math.tan);  //function
console.log(typeof function(){}); //function


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


//if(neverDeclared == null) //showing error




console.log(typeof {a:1}); //object
console.log(typeof null); //object
console.log(typeof JSON); //object
console.log(typeof Math); //object
console.log(typeof /a-z/); //object
console.log(typeof new Date()); //object


console.log(typeof afbc); //undefined
//console.log(typeof new);//error


document.write("<br> * oprator as math ");
var r=14*"4";
document.write(r);


document.write("<br> + oprator as string ");
var r=14+"44";
document.write(r);


document.write("<br> Minus Operator work as mathematic ");
var r=64-"44";
document.write(r);




document.write("<br>");
console.log(typeof(4*"7")); //returns number
console.log(typeof(4+"7")); //returns string








Interview Question in JavaScript

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


console.log(greeting,name);
}


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


//ES6 provides new ways of introducing default function parameters this way:


function greet2(name = 'Student', greeting = 'Welcome') {
//  return '${greeting} ${name}!';
console.log(greeting,name);
}


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

var bar = null;
console.log(typeof bar === "object"); //true yes
//because null a datatype of object


var barf = "dff";
console.log(typeof barf.constructor);//function




console.log(Array.isArray(bar));//falsss




console.log((bar !== null) && (bar.constructor === Object)); //false


console.log((bar !== null) && (typeof bar === "object"));  // logs false
//because bar!==null, bar is a object




console.log((bar !== null) && ((typeof bar === "object") || (typeof bar === "function"))); //false


console.log(typeof bar === typeof object); //false
console.log(typeof bar2 === typeof undefined); //true
console.log(typeof bar3 === typeof undefinedff); //true
console.log(typeof bar2 == typeof undefined); //true


console.log((bar !== null) && (typeof bar === "object") && (toString.call(bar) !== "[object Array]")); //false