js中,封装一个判断所有数据类型的方法getType,入参为任意变量,返回值为该参数类型的字符串形式
创始人
2024-04-28 10:46:28
0

js中,封装一个判断所有数据类型的方法getType,入参为任意变量,返回值为该参数类型的字符串形式

1、封装方法

基本数据类型,包括:undefined/null/string/number/boolean。

  • typeof 对null值进行判断时,返回的是object。因为null是一个空数据的地址,该方法误判其为object,然后这个错误保留。
  • 引用数据类型,typeof打印都是有 object,对常用的数据类型(Array/Date/RegExp)进行 typeof 操作时,返回的也只是 object,这就导致我们在使用时没法准确的区分了。因此我们需要一个方法,能够返回更详细的数据类型信息。

tool.js


2、检测数据类型的方法

2.1、typeof

typeof操作符返回一个用来表示数据类型的字符串,即:typeof运算之后的结果都是字符串类型。

注意:typeof是一个操作符,不是一个函数!

keyvalue
string字符串
boolean布尔值
number数值
undefined未定义
object对象,数组或null
function函数
symbolsymbol
实例
var num=123;
var str="123";
var boo=true;
var und=undefined;
var arr=[];
var obj={};
var nul=null;
var fun=function(){};
var s = Symbol();console.log(typeof num); //"number"
console.log(typeof str); //"string"
console.log(typeof boo); //"boolean"
console.log(typeof und); //"undefined"
console.log(typeof arr); //"object"
console.log(typeof obj); //"object"
console.log(typeof nul); //"object"
console.log(typeof fun); //"function"
  • 优点
    能检测出number,boolean,string,symbol,undefined,function,object
  • 缺点
    基本数据类型,null返回object 其他都可以返回正确结果
    引用数据类型,除了function以外,都返回object
    function返回function类型
2.2、instanceof

instanceof运算符用于测试构造函数的prototype属性是否出现在对象的原型链中的任何位置.
语法: object instanceof 构造函数
返回值:如果是这个构造函数构造出来的,返回true,否则返回false。

实例
console.log(1 instanceof Number); //false
console.log("liuqiao" instanceof String); //false
console.log(true instanceof Number); //false
console.log(function(){} instanceof Function); //true
console.log({} instanceof Object);//true
console.log([1,2,3] instanceof Array);//true

结论:

instanceof 运算符用于对象类型检测,无法检测基本数据类型,因为内部机制是通过判断对象的原型链中是不是能找到类型的 prototype。
并且也无法检测undefined和null ,因为他们两个比较特殊,使用instanceof检测时,浏览器根本不识别,会报错

instanceof 只要该实例的父亲辈,爷爷辈以及祖先辈,都会返回true

  • 优点
    可以检测出某特定的引用类型具体是某种类型
  • 缺点
    只能检测引用类型
2.3、constructor

每个对象都有一个隐藏属性constructor,该属性指向对象的构造函数(类)

实例
console.log(("1").constructor === String);//true
console.log((1).constructor === Number);//true
console.log((true).constructor === Boolean);//true
console.log(([]).constructor === Array);//true
console.log((function () { }).constructor === Function);//true
console.log(({}).constructor === Object);//true
  • 优点
    基本上基本数据类型和引用数据类型都可以检测,但是除了自定义的对象外

  • 缺点
    为什么说除了自定义对象外都可以检测 ,因为检测自定义对象时不可靠!

    具体原因参考用constructor来做类型识别,并不可靠。函数的 constructor 是不稳定的,这个主要体现在自定义对象上,当开发者重写 prototype 后,原有的 constructor 引用会丢失,constructor 会默认为 Object。
    undefined和null无法检测

2.4、Object.prototype.toString.call()

使用Object.prototype上的原生toString()方法判断数据类型当要判断多类型比较复杂的时候,强烈推荐使用这个方法
jQuery就是通过这种方式来判断的!

实例
 var m = Object.prototype.toString;console.log(m.call("aaa"));//[object String]console.log(m.call(1));//[object Number]console.log(m.call(true));//[object Boolean]console.log(m.call(null));//[object Null]console.log(m.call(undefined));//[object Undefined]console.log(m.call([]));//[object Array]console.log(m.call(function () { }));//[object Function]console.log(m.call({}));//[object Object]console.log(m.call(new Date));//[object Date]console.log(m.call(/\d/));//[object RegExp]function Person() { };console.log(m.call(new Person));//[object Object]
  • 优点

基本上的数据类型都可以检测

  • 缺点

自定义的类是不能准确判断的,这里可以采用instanceof

Object.prototype.toString()本身是允许被修改的,而我们目前所讨论的关于Object.prototype.toString()这个方法的应用都是假设toString()方法未被修改为前提的。

  • 扩展

我们发现上面打印[object String]类似这种不太完美,比如我想直接打印string呢

相关内容

热门资讯

【NI Multisim 14...   目录 序言 一、工具栏 🍊1.“标准”工具栏 🍊 2.视图工具...
银河麒麟V10SP1高级服务器... 银河麒麟高级服务器操作系统简介: 银河麒麟高级服务器操作系统V10是针对企业级关键业务...
不能访问光猫的的管理页面 光猫是现代家庭宽带网络的重要组成部分,它可以提供高速稳定的网络连接。但是,有时候我们会遇到不能访问光...
AWSECS:访问外部网络时出... 如果您在AWS ECS中部署了应用程序,并且该应用程序需要访问外部网络,但是无法正常访问,可能是因为...
Android|无法访问或保存... 这个问题可能是由于权限设置不正确导致的。您需要在应用程序清单文件中添加以下代码来请求适当的权限:此外...
AWSElasticBeans... 在Dockerfile中手动配置nginx反向代理。例如,在Dockerfile中添加以下代码:FR...
北信源内网安全管理卸载 北信源内网安全管理是一款网络安全管理软件,主要用于保护内网安全。在日常使用过程中,卸载该软件是一种常...
AsusVivobook无法开... 首先,我们可以尝试重置BIOS(Basic Input/Output System)来解决这个问题。...
月入8000+的steam搬砖... 大家好,我是阿阳 今天要给大家介绍的是 steam 游戏搬砖项目,目前...
​ToDesk 远程工具安装及... 目录 前言 ToDesk 优势 ToDesk 下载安装 ToDesk 功能展示 文件传输 设备链接 ...