JavaScript类型检测【全】

类型检测的方法:

  1. typeof
  2. instanceof
  3. Object.prototype.toString
  4. constructor

typeof

typeof 操作符返回一个字符串,表示未经计算的操作数的类型。

js 复制代码
typeof undefined;
// "undefined"

typeof null;
// "object"

typeof 100;
// "number"

typeof NaN;
// "number"

typeof true;
// "boolean"

typeof 'foo';
// "string"

typeof function () {};
// "function"

typeof [1, 2];
// "object"

typeof new Object();
// "object"

typeof 操作符适合对 基本类型 (除 null 之外)及 function 的检测使用,而对引用数据类型(如 Array)等不适合使用。

instanceof

instanceof 运算符用于检测一个对象在其 原型链 中是否存在一个构造函数的 prototype 属性。

左操作数为对象,不是就返回 false,右操作数必须是 函数对象 或者 函数构造器,不是就返回 TypeError 异常。

js 复制代码
function Person() {}
function Student() {}
Student.prototype = new Person();
Student.prototype.constructor = Student;

const ben = new Student();
ben instanceof Student;
// true

const one = new Person();
one instanceof Person;
// true
one instanceof Student;
// false
ben instanceof Person;
// true

任何一个构造函数都有一个 prototype 对象属性,这个对象属性将用作 new 实例化对象的原型对象。

📍 instanceof 适合用于判断对象是否属于 Array、Date 和 RegExp 等内置对象。

📍 不同 window 或 iframe 之间的对象类型检测无法使用 instanceof 检测。

Object.prototype.toString

可以通过 toString() 来获取每个对象的类型。

为了 每个对象 都能通过 Object.prototype.toString 来检测,需要以 Function.prototype.call 或者 Function.prototype.apply 的形式来调用,传递要检查的对象作为第一个参数。

js 复制代码
Obejct.prototype.toString.call(undefined);
//  "[object Undefined]"

Obejct.prototype.toString.call(null);
//  "[object Null]"

Obejct.prototype.toString.call(true);
//  "[object Boolean]"

Obejct.prototype.toString.call('');
/// "[object String]"

Obejct.prototype.toString.call(123);
//  "[object Number]"

Obejct.prototype.toString.call([]);
//  "[object Array]"

Obejct.prototype.toString.call({});
//  "[object Object]"

💡 使用 Object.prototype.toString 方法能精准地判断出值的数据类型。

⚠️ 注意事项:

方法重写:Object.prototype.toString 属于 Object 的原型方法,而 Array 或 Function 等类型作为 Object 的实例,都重写了 toString 方法。因此,不同对象类型调用 toString 方法时,调用的是重写后的 toString 方法,而非 Object 上原型 toString 方法,所以采用 xxx.toString() 不能得到其对象类型,只能将 xxx 转换成字符串类型。

constructor

任何对象都有 constructor 属性,继承自原型对象,constructor 会指向构造这个对象的构造器或构造函数。

js 复制代码
Student.prototype.constructor === Student;
//  true

数组检测

ECMAScript5 将 Array.isArray() 正式引入 JavaScript,该方法能准确检测一个变量是否为数组类型。

js 复制代码
Array.isArray(variable);
相关推荐
怕浪猫1 小时前
分享一个做视频的skill,这条白板视频,每一笔都是代码画的
前端·javascript·面试
Yunovian2 小时前
AI时代,针对模型与应用,浅谈一下各编程语言
开发语言·c++·人工智能·python·ai·rust·ai编程
周杰伦fans3 小时前
构建真正智能的CAD AI绘图代理
开发语言·人工智能·c#
OpsEye4 小时前
当企业不再只关心能不能调用模型,而是关心值不值得调用
javascript·ai编程
FYKJ_20105 小时前
express皖美特色农产品网售系统53118-计算机课程设计、毕业设计
javascript·vue.js·spring boot·mysql·typescript·spark·express
zhanghaha13145 小时前
Python进阶教程:35_PyQt (保姆级零基础教程)
开发语言·python·pyqt
释厄6235 小时前
多黑洞具现论·物理/生物/金融三域显化·虚拟宇宙黑洞·奇点=0 圆圈
开发语言·数据结构·人工智能·程序人生·安全威胁分析
晓得迷路了6 小时前
栗子前端技术周刊第 148 期 - Turborepo 2.11、Chrome 154 iframe、Node.js 26...
前端·javascript·css
Fruit_Caller6 小时前
static
开发语言·c++
默_笙11 小时前
🚓 分诊台与拆题术:让 RAG 学会判断和规划
前端·javascript