当前位置:首页 > JavaScript

js实现typeof

2026-01-31 20:23:34JavaScript

typeof 运算符的基本用法

在 JavaScript 中,typeof 是一个一元运算符,用于返回一个表示操作数类型的字符串。以下是基本语法和常见类型的返回值:

typeof operand

常见返回值:

js实现typeof

  • "number":数值类型(包括 NaN)。
  • "string":字符串类型。
  • "boolean":布尔类型。
  • "undefined":未定义的变量或值。
  • "object":对象或 null(历史遗留问题)。
  • "function":函数类型。
  • "symbol":Symbol 类型(ES6 新增)。

实现自定义 typeof 函数

由于原生 typeofnull 和数组的检测不够精确,可以通过以下方式实现更精确的类型检测:

js实现typeof

function customTypeof(value) {
  if (value === null) {
    return "null";
  }
  const baseType = typeof value;
  if (baseType !== "object") {
    return baseType;
  }
  const objectType = Object.prototype.toString.call(value).slice(8, -1).toLowerCase();
  return objectType;
}

处理特殊情况的示例

针对 null、数组和内置对象的检测:

console.log(customTypeof(null)); // "null"
console.log(customTypeof([])); // "array"
console.log(customTypeof(new Date())); // "date"
console.log(customTypeof(/regex/)); // "regexp"

使用 Object.prototype.toString 的底层原理

Object.prototype.toString 方法会返回 [object Type] 格式的字符串,其中 Type 是对象的内部类型:

Object.prototype.toString.call(42); // "[object Number]"
Object.prototype.toString.call("hello"); // "[object String]"
Object.prototype.toString.call(true); // "[object Boolean]"

注意事项

  • 原生 typeof 对函数返回 "function",但函数本质是可调用的对象。
  • 使用 instanceof 可以检测对象的构造函数链。
  • 现代 JavaScript 可以使用 Symbol.toStringTag 自定义对象的类型标签。

标签: jstypeof
分享给朋友:

相关文章

js实现倒计时

js实现倒计时

实现倒计时的基本方法 使用 JavaScript 实现倒计时功能可以通过 setInterval 或 setTimeout 结合日期计算来完成。以下是几种常见的实现方式: 使用 setInterva…

js实现继承

js实现继承

原型链继承 通过将子类的原型指向父类的实例实现继承。子类实例可以访问父类原型上的属性和方法。 function Parent() { this.name = 'parent'; } Parent…

js实现验证

js实现验证

验证表单输入 使用JavaScript验证表单输入是常见的需求。可以通过监听表单提交事件,检查输入字段是否符合要求。 document.getElementById('myForm').addEve…

js实现列表

js实现列表

使用 JavaScript 实现列表 JavaScript 提供了多种方式来实现列表功能,包括数组操作、DOM 元素动态生成等。以下是几种常见的实现方法: 使用数组存储列表数据 数组是 JavaSc…

js 实现分页

js 实现分页

实现分页的基本逻辑 分页功能通常需要后端返回数据总量或总页数,前端根据当前页码和每页条数截取对应数据。以下是一个基于JavaScript的简单分页实现方案: 前端分页实现 假设已有从后端获取的完整数…

js实现换肤

js实现换肤

使用CSS变量实现换肤 通过CSS变量可以轻松实现主题切换功能。CSS变量在根元素中定义,通过JavaScript动态修改这些变量值。 :root { --primary-color: #34…