数据类型检测的方法有哪些???

数据类型检测的方法有哪些???

1. typeof

js 复制代码
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 ,其他都正确

我们知道object是一种广泛类型,它涵盖了普通的对象、数组、函数,那为什么function没有被判断为object,而null却判断为object了呢??

  • 虽然函数确实是对象的一种类型,但在JavaScript中,函数被视为一种特殊的对象,因为它们具有可调用的行为。因此,typeof操作符将函数识别为函数类型,而不是对象类型。在JavaScript中,函数被视为一等公民,具有一些独特的特性,例如:

(1) 可调用性 :函数可以通过()运算符进行调用,执行其中的代码。

(2) 具有属性和方法:函数是对象的一种特殊形式,可以拥有属性和方法。

  • 在JavaScript中,将null判断为object是一个历史遗留问题,属于语言本身的设计缺陷。这个问题源于JavaScript的早期版本中的一个错误。在JavaScript的初始实现中,使用32位系统表示值的前三位用于标识该值的类型。其中,对象的标识位为000,而null被错误地赋予了000,因此被错误地判断为对象。

尽管这个问题已经存在了很长时间,但为了保持向后兼容性,JavaScript的设计者们选择不修复这个问题。因此,即使在现代的JavaScript引擎中,typeof null仍然返回"object"

2.instanceof

instanceof可以正确地判断对象的类型,其内部运行机制是判断在其原型链中能否找到该类型的原型

js 复制代码
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

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

js 复制代码
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 来判断数据类型:

js 复制代码
var a = Object.prototype.toString;
 
console.log(a.call(2));
console.log(a.call(true));
console.log(a.call('str'));
console.log(a.call([]));
console.log(a.call(function(){}));
console.log(a.call({}));
console.log(a.call(undefined));
console.log(a.call(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方法。

相关推荐
努力成为AK大王几秒前
CSS 入门完整笔记
前端·css
微笑挖矿8 分钟前
大模型流式渲染:为什么"逐字显示"远比你想的复杂
前端
weedsfly8 分钟前
前端开发中的装饰器模式——给函数和组件“加壳”的艺术
前端·javascript·面试
zhedream9 分钟前
那个从没改过的页面,为什么突然坏了?
前端·vue.js
工业HMI实战笔记17 分钟前
HMI性能优化技巧:告别卡顿,打造流畅体验
前端·ui·性能优化·自动化·交互
QN1幻化引擎25 分钟前
Gravity-Anchored Cognitive Field Architecture: The DalinX V8/V10 Implementation
java·前端·算法
光影少年30 分钟前
react的View/Text/Image/ScrollView 常用组件注意事项
开发语言·前端·javascript·react.js·前端框架
yangmu320337 分钟前
前端性能优化实战:我是如何将首屏加载时间缩短 40% 的?
前端·性能优化
IT_陈寒43 分钟前
JavaScript的隐式类型转换又双叒坑了我一次!
前端·人工智能·后端
JarvanMo1 小时前
HTTP的DELET方法能不能有Body?
前端