2.检测数据类型的方式

1.typeof

javascript 复制代码
console.log(typeof 2);               // number
console.log(typeof true);            // boolean
console.log(typeof 'str');           // string
console.log(typeof []);              // object    
console.log(typeof function(){});    // function
console.log(typeof {});              // object
console.log(typeof undefined);       // undefined
console.log(typeof null);            // object

其中数组、对象、null都会被判断为object,其他判断都正确。

2.instanceof

instanceof可以正确判断对象 的类型(注意是对象的类型,基本数据类型无法正确判断 ),其内部运行机制是判断在其原型链中能否找到该类型的原型

javascript 复制代码
console.log(2 instanceof Number);                    // false
console.log(true instanceof Boolean);                // false 
console.log('str' instanceof String);                // false 
 
console.log([] instanceof Array);                    // true
console.log(function(){} instanceof Function);       // true
console.log({} instanceof Object);                   // true

可以看到,instanceof只能正确判断引用数据类型 ,而不能判断基本数据类型。instanceof 运算符可以用来测试一个对象在其原型链中是否存在一个构造函数的 prototype 属性。

3.constructor

javascript 复制代码
console.log((2).constructor === Number); // true
console.log((true).constructor === Boolean); // true
console.log(('str').constructor === String); // true
console.log(([]).constructor === Array); // true
console.log((function() {}).constructor === Function); // true
console.log(({}).constructor === Object); // true

constructor有两个作用,一是判断数据的类型,二是对象实例通过 constrcutor 对象访问它的构造函数。需要注意,如果创建一个对象来改变它的原型,constructor就不能用来判断数据类型了:

javascript 复制代码
function Fn(){};
 
Fn.prototype = new Array();
 
var f = new Fn();
 
console.log(f.constructor===Fn);    // false
console.log(f.constructor===Array); // true

4.Object.prototype.toString.call()

Object.prototype.toString.call() 使用 Object 对象的原型方法 toString 来判断数据类型:

javascript 复制代码
var a = Object.prototype.toString;

console.log(a.call(2));// Number
console.log(a.call(true));//Boolean
console.log(a.call('str'));//String
console.log(a.call([]));//Array
console.log(a.call(function(){}));//Function
console.log(a.call({}));//Object
console.log(a.call(undefined));//Undefined
console.log(a.call(null));//Null

同样是检测对象obj调用toString方法,obj.toString()的结果和Object.prototype.toString.call(obj)的结果不一样,这是为什么?

这是因为toString是Object的原型方法,而Array、function等类型作为Object的实例,都重写了toString方法 。不同的对象类型调用toString方法时,根据原型链的知识,调用的是对应的重写之后的toString方法(function类型返回内容为函数体的字符串,Array类型返回元素组成的字符串...),而不会去调用Object上原型toString方法(返回对象的具体类型),所以采用obj.toString()不能得到其对象类型,只能将obj转换为字符串类型;因此,在想要得到对象的具体类型时,应该调用Object原型上的toString方法。

相关推荐
Crystal328几秒前
3D实战案例(飞行的火箭/创建3D导航/翻书效果/创建长方体/环环相扣效果)
前端·css
6***x545几秒前
前端组件库发展趋势,原子化CSS会成为主流吗
前端·css
mine_mine几秒前
油猴脚本拦截fetch和xhr请求,实现修改服务端接口功能
javascript
00后程序员张1 分钟前
接口调试从入门到精通,Fiddler抓包工具、代理配置与HTTPS抓包实战技巧
前端·ios·小程序·https·fiddler·uni-app·webview
快手技术3 分钟前
闪耀NeurIPS 2025!快手13篇论文入选,Spotlight 成果跻身前三!
前端·后端
一 乐11 分钟前
宠物猫店管理|宠物店管理|基于Java+vue的宠物猫店管理管理系统(源码+数据库+文档)
java·前端·数据库·vue.js·后端·宠物管理
熊猫比分管理员26 分钟前
【全栈源码解决方案】Vue+Java四端齐全,一周交付可运行项目!
java·前端·vue.js
o***741727 分钟前
【Nginx 】Nginx 部署前端 vue 项目
前端·vue.js·nginx
坚持就完事了27 分钟前
CSS-5:盒子模型
前端·css·html
一 乐28 分钟前
考公|考务考试|基于SprinBoot+vue的考公在线考试系统(源码+数据库+文档)
前端·javascript·数据库·vue.js·spring boot·课程设计