typeof的迷惑行为大赏：JavaScript基础类型判定的那些“坑”

「小墨是前端」致力于分享实用前端技术、挖掘优秀的开源项目，带你探索前端的奇妙世界，共同学习进步。

前端开发中，typeof运算符就像是一位低调的侦探，帮助我们识别变量的类型。但在某些情况下，也会展有一些迷惑的行为，让开发者们摸不着头脑。本期我们就来揭开typeof的神秘面纱，探究它背后的那些“未解之谜”。

typeof基础：一眼识破变量身份

typeof运算符会返回一个字符串，表示操作数的数据类型。对于JavaScript中的基本类型，typeof表现得非常可靠：

console.log(typeof 123);        // 输出: "number"

console.log(typeof "hello");    // 输出: "string"

console.log(typeof true);       // 输出: "boolean"

console.log(typeof undefined); // 输出: "undefined"

console.log(typeof Symbol());   // 输出: "symbol"

console.log(typeof 123n);       // 输出: "bigint"  // ES2020新增的大整数类型

简单明了，一目了然！这使得typeof成为判断基本类型变量的利器。

typeof的“迷惑行为大赏”

但是在当面对对象类型时，typeof就开始展现它的“迷惑行为”了。

1.null之谜：历史遗留的“bug”

typeof null的结果是"object"，这可是一个历史悠久的bug！它源于JavaScript早期的实现方式，虽然广为人知，但却无法修复，以免破坏大量现有代码。所以，记住这个特例，不要被它迷惑了！

console.log(typeof null);      // 输出: "object"

1.NaN之谜：数值类型的“叛徒”

NaN（Not a Number），顾名思义，它表示“不是一个数字”。然而，typeof NaN却返回"number"，这让人匪夷所思。其实，NaN是一种特殊的数值类型，表示无效或无法表示的数值计算结果。要判断一个值是否为NaN，推荐使用Number.isNaN()方法。

console.log(typeof NaN);      // 输出: "number"

console.log(Number.isNaN(NaN)); // 输出: true

1.Function.prototype之谜：函数原型的特殊身份

通常，对象的原型对象也是一个对象。例如：typeof Array.prototype和typeof Object.prototype都返回"object"。但是，Function.prototype却是个例外，typeof Function.prototype返回"function"。这是因为Function.prototype本身就是一个函数，这个设定与ES6及之后版本的特性有关。

console.log(typeof Function.prototype); // 输出: "function"typeof实战小技巧

掌握了typeof的这些“迷惑行为”，我们就能更好地运用它。以下是一些实用小技巧：

•使用new关键字创建基本类型包装对象使用new Number(1)、new String("abc")或new Boolean(true)会创建对应的包装对象，它们的类型都是"object"，而非"number"、"string"或"boolean"。在实际开发中，应尽量避免使用这种方式创建基本类型。

console.log(typeof new Number(1));   // 输出: "object"

console.log(typeof new String("abc")); // 输出: "object"

console.log(typeof new Boolean(true));  // 输出: "object"

创作不易，求点赞、求在看、求转发！你的支持是我创作的最大动力！关注小墨，带你解锁更多前端技能！