JavaScript数据类型判断之Object.prototype.toString.call() 的详解

Object.prototype.toString.call() 的详解

Object.prototype.toString.call() 是 JavaScript 中判断数据类型的强大方法。它可以精确区分所有的 JavaScript 内置类型,包括原始类型和对象类型。


语法

javascript 复制代码
Object.prototype.toString.call(value)
  • value 是要检测类型的变量。
  • 返回结果是一个类似 "[object Type]" 的字符串,其中 Type 是该变量的类型名称。

为什么使用它?

  • 准确性 :它可以区分 nullundefined,以及各种内置对象(如 ArrayDate 等)。
  • 通用性:不依赖环境或原型链,可以用于跨环境的类型判断。

返回值

以下是常见数据类型及其对应的返回值:

数据类型 返回值
Number [object Number]
String [object String]
Boolean [object Boolean]
Undefined [object Undefined]
Null [object Null]
Array [object Array]
Object [object Object]
Function [object Function]
Date [object Date]
RegExp [object RegExp]
Error [object Error]
Symbol [object Symbol]
Map [object Map]
Set [object Set]
WeakMap [object WeakMap]
WeakSet [object WeakSet]
BigInt [object BigInt]
自定义类实例 [object Object]

示例

javascript 复制代码
// 基本类型
console.log(Object.prototype.toString.call(123)); // [object Number]
console.log(Object.prototype.toString.call("hello")); // [object String]
console.log(Object.prototype.toString.call(true)); // [object Boolean]
console.log(Object.prototype.toString.call(undefined)); // [object Undefined]
console.log(Object.prototype.toString.call(null)); // [object Null]

// 对象类型
console.log(Object.prototype.toString.call([])); // [object Array]
console.log(Object.prototype.toString.call({})); // [object Object]
console.log(Object.prototype.toString.call(function() {})); // [object Function]
console.log(Object.prototype.toString.call(new Date())); // [object Date]
console.log(Object.prototype.toString.call(/abc/)); // [object RegExp]

// 特殊对象
console.log(Object.prototype.toString.call(new Map())); // [object Map]
console.log(Object.prototype.toString.call(new Set())); // [object Set]
console.log(Object.prototype.toString.call(Symbol())); // [object Symbol]
console.log(Object.prototype.toString.call(BigInt(123))); // [object BigInt]

适用场景

  1. 区分 nullobject

    javascript 复制代码
    console.log(typeof null); // "object" (误导性结果)
    console.log(Object.prototype.toString.call(null)); // [object Null]
  2. 区分对象类型

    javascript 复制代码
    console.log(Object.prototype.toString.call([])); // [object Array]
    console.log(Object.prototype.toString.call({})); // [object Object]
  3. 跨环境检测

    在不同的 JavaScript 环境中(如浏览器和 Node.js),使用 instanceof 有时可能会失败,而 Object.prototype.toString.call() 是可靠的。


封装为通用函数

可以封装为一个类型检测工具:

javascript 复制代码
function getType(value) {
  return Object.prototype.toString.call(value).slice(8, -1).toLowerCase();
}

console.log(getType(123)); // "number"
console.log(getType(null)); // "null"
console.log(getType([])); // "array"
console.log(getType(new Map())); // "map"
console.log(getType(() => {})); // "function"

注意事项

  • 自定义类实例(非内置对象)都会返回 [object Object],如果需要区分,可以结合 constructor.name

    javascript 复制代码
    class MyClass {}
    const instance = new MyClass();
    console.log(Object.prototype.toString.call(instance)); // [object Object]
    console.log(instance.constructor.name); // MyClass
  • 无法检测用户定义的 Symbol.toStringTag 修改:

    javascript 复制代码
    const obj = { [Symbol.toStringTag]: "CustomTag" };
    console.log(Object.prototype.toString.call(obj)); // [object CustomTag]

Object.prototype.toString.call() 是一种强大的数据类型判断方法,特别适用于复杂类型判断。

相关推荐
吃饺子不吃馅3 小时前
为什么SnapDOM 比 html2canvas截图要快?
前端·javascript·面试
mCell11 小时前
GSAP ScrollTrigger 详解
前端·javascript·动效
gnip11 小时前
Node.js 子进程:child_process
前端·javascript
codingandsleeping16 小时前
使用orval自动拉取swagger文档并生成ts接口
前端·javascript
白水清风17 小时前
微前端学习记录(qiankun、wujie、micro-app)
前端·javascript·前端工程化
用户221520442780018 小时前
new、原型和原型链浅析
前端·javascript
阿星做前端18 小时前
coze源码解读: space develop 页面
前端·javascript
叫我小窝吧18 小时前
Promise 的使用
前端·javascript
前端康师傅19 小时前
JavaScript 作用域
前端·javascript
云枫晖19 小时前
JS核心知识-事件循环
前端·javascript