本文详细解析 JavaScript 中判断数据类型的四种核心方法:typeof、instanceof、constructor 以及 Object.prototype.toString。通过对比各方法的原理、适用场景及局限性,并结合 Lodash 源码实现,帮助开发者准确识别基本类型与引用类型,避免常见陷阱。
typeof 运算符及其局限性
typeof
该方法通常用于区分基本数据类型。然而,在处理引用数据类型以及 null 时,其结果往往不符合预期,容易产生误判。
typeof 1 // number
typeof '1' // string
typeof true // boolean
typeof Symbol('1') // symbol
typeof undefined // undefined
typeof function(){} // function
typeof { a: 1 } // object
typeof [1, 2, 3] // object 这里会判断异常,建议使用Array.isArray区分数组和对象
//以下也会判断异常
typeof new Boolean(true) === 'object';
typeof new Number(1) === 'object';
typeof new String('abc') === 'object';
//最后来看null
typeof null // object
探究 typeof 的底层原理可知,不同类型的对象在二进制层面均被表示为特定的位模式。在 JavaScript 中,若二进制的前三位均为 0,系统会将其判定为 object 类型。由于 null 的二进制表示全为 0(对应机器码中的空指针,通常也是全 0),因此 typeof null 会返回 'object'。
instanceof 与 constructor 方法
instanceof
instanceof 运算符的主要功能是检测一个实例对象是否属于某个特定的构造函数类型,因此在判断对象所属类型时非常适用。
语法:object instanceof constructor
object 某个实例对象 constructor 某个构造函数
'abc' instanceof String //false 检查原型链会返回undefined
new String('abc') instanceof String //true
new Boolean(true) instanceof Boolean // true
new Number(1) instanceof Number // true
顺便做一下简单实现
function new_instance_of(leftVaule, rightVaule) {
let leftProto = leftVaule.__proto__; // 取左表达式的__proto__值
let rightPrototype = rightVaule.prototype; // 取右表达式的 prototype 值
while (true) {
if (leftProto === null) {
return false;
}
if (rightPrototype === rightProto) {
return true;
}
leftProto = leftProto.__proto__
}
}
constructor
该方法依据数据类型的构造函数来返回类型信息。需要注意的是,null 和 undefined 没有构造函数,因此无法使用此方法对它们进行判断。
''.constructor == String //true
new Number(1).constructor == Number //true
new Function().constructor == Function //true
true.constructor == Boolean //true
new Date().constructor == Date //true
Object.prototype.toString 与 Lodash 实现
Object.prototype.toString.call()
可以通过调用 toString() 方法来获取每个对象的具体类型。为了确保所有对象都能通过 Object.prototype.toString() 进行准确检测,需要利用 Function.prototype.call() 或 Function.prototype.apply() 形式来调用该方法,并将待检查的对象作为第一个参数传递进去。
var toString = Object.prototype.toString;
toString.call(new Date); // [object Date]
toString.call(new String); // [object String]
toString.call(Math); // [object Math]
toString.call(undefined); // [object Undefined]
toString.call(null); // [object Null]
lodash.getTag和lodash.baseGetTag
lodash 库中的 baseGetTag 方法结合了 Object.prototype.toString.call 和 Symbol.toStringTag 来判断属性类型。其中,Symbol.toStringTag 仅适用于特定类型的判断场景。

//lodash.baseGetTag部分重要源码
//如果值是undefined和null返回对应tag
if (value == null) {
return value === undefined ?
'[object Undefined]'
:
'[object Null]'
}
// 如果不支持Symbol或者value值上面没有Symbol.toStringTag属性,
//直接返回Object.prototype.toString调用后的值
if (!(symToStringTag && symToStringTag in Object(value))) {
return toString.call(value)
}
以上即为 JavaScript 中判断数据类型的详细方法介绍,更多关于 JS 数据类型判断的资料,欢迎持续关注本站的其他相关文章。