首页 > 其他分享 >JS中判断数据类型的四种方法

JS中判断数据类型的四种方法

时间:2024-09-14 09:51:38浏览次数:13  
标签:console log Object 数据类型 JS let toString prototype 四种

前言

近期回顾了JS的知识,重新梳理一下几种不同的判断数据类型的方式,对于不同的数据类型,可以用不同的判断方式,防止类型判断的不够精确。

一.typeof

typeof可以用来判断number、string、boolean、undefined这四种简单数据类型,以及function这个引用类型(复杂数据类型)。具体写法如下:

typeof  要判断的数据

    let arr = [1, 2, 3]
    let num = 1
    let str = 'abc'
    let fn = function () {
        console.log(1);
    }
    let obj = {
        name: "张三",
        age: 12
    }
    console.log(typeof num);//number
    console.log(typeof str);//string
    console.log(typeof true);//boolean
    console.log(typeof undefined);//undefined
    console.log(typeof null);//object
    console.log(typeof fn);//function
    console.log(typeof obj);//object
    console.log(typeof arr);//object
    console.log(typeof (new Date));//object

可以看见typeof只能识别出number、string、boolean、undefined以及function的具体类型,对于null、array、obj只能识别为obj类型,但不能识别出具体对象类型(Date、Function、Array、Regexp、Number、Object、String、Math、Global、Boolean)。

二.instanceof

instanceof 运算符用于检测构造函数(右边)的 prototype 属性是否出现在某个实例对象(左边)的原型链上。这种方法判断结果返回的是boolean值,并且只能用于对象、数组、函数,不能用于简单数据类型上,具体写法:

要判断的数据 instanceof 数据类型

let arr = [1, 2, 3]
    let num = 1
    let str = 'abc'
    let fn = function () {
        console.log(1);
    }
    let obj = {
        name: "张三",
        age: 12
    }
    console.log(num instanceof Number);//false
    console.log(arr instanceof Array);//true
    console.log(fn instanceof Function);//true
    console.log(obj instanceof Object);//true
    console.log((new Date) instanceof Date);//true

 三.Object.prototype.toString.call()

每个对象都有一个 toString() 方法,当该对象被表示为一个文本值时,或者一个对象以预期的字符串方式引用时自动调用。


默认情况下,toString() 方法被每个 Object 对象继承。如果此方法在自定义对象中未被覆盖,toString() 返回 "[object type]",其中 type 是对象的类型。


由于Object.prototype.toString()本身允许被修改,像Array、Boolean、Number的toString就被重写过,要是想判断传入值的类型,需要把传入值的this,指向Object.prototype ,才能判断传入值的类型,所以需要调用Object.prototype.toString.call(arg)来判断arg的类型,call将arg的上下文指向Object,所以arg执行了Object的toString方法。具体写法:

Object.prototype.toString.call(要判断的数据)

let arr = [1, 2, 3]
    let num = 1
    let str = 'abc'
    let fn = function () {
        console.log(1);
    }
    let obj = {
        name: "张三",
        age: 12
    }
 console.log(Object.prototype.toString.call(num));        // [object Number]
 console.log(Object.prototype.toString.call(str)); // [object String ]
 console.log(Object.prototype.toString.call(true));     // [object Boolean]
 console.log(Object.prototype.toString.call(undefined));  // [object Undefined]
 console.log(Object.prototype.toString.call(fn));   // [object Function]
 console.log(Object.prototype.toString.call(new Date));  // [object Date]
 console.log(Object.prototype.toString.call(null));   // [object Null]
 console.log(Object.prototype.toString.call(arr));  // [object Array]
 console.log(Object.prototype.toString.call(obj));       // [object Object]

 四.constructor

我们可以通过constructor来判断数据的类型,但是除了null、undefined,因为他们不是由对象构建。数字、布尔值、字符串是包装类对象,所以有constructor。constructor是原型对象的属性,指向构造函数。a.constructor==b。判断b是不是a的构造函数。具体写法:

要判断的数据.constructor===数据类型

 let arr = [1, 2, 3]
    let num = 1
    let str = 'abc'
    let fn = function () {
        console.log(1);
    }
    let obj = {
        name: "张三",
        age: 12
    }
    console.log(num.constructor === Number);  //true
    console.log(str.constructor === String);  //true
    console.log(true.constructor === Boolean);  //true
    console.log(fn.constructor === Function);  //true
    console.log((new Date).constructor === Date);  //true
    console.log(obj.constructor === Object);  //true
    console.log(arr.constructor === Array);  //true

标签:console,log,Object,数据类型,JS,let,toString,prototype,四种
From: https://blog.51cto.com/u_16717092/12014699

相关文章

  • package.json依赖包漏洞之tough-cookie原型污染漏洞
    背景有个安全扫描的流水线,扫描了我负责的项目之后,发现一些漏洞。需要说明的是,这个扫描只是针对package.json文件,扫的是依赖树,而不是项目源代码,也不是build打包后的代码。这些正是我们提升项目安全性的宝贵机会。让我们一起来看看这些发现,并学习如何将它们转化为我们的优势。 ......
  • Js基础之循环分支
    1.if语句单分支:除了0所有的数字都为真除了空字符串,所有的数字都为真if(0){console.log();//不执行,负数也执行,只要不为0就行}题目:单分支课堂案例1:用户输入高考成绩,如果分数大于700,则提示恭喜考入黑马程序员//1.用户输入letscore=+prompt('请输入成绩')//12、进......
  • Js基础之数组
    数组(Array)-----一种将一组数据存储在单个变量名下的优雅方式letarr=[]//arr是变量[]里是数组字面量1.基本使用1.声明语法//声明数组let数组名=[数据1,数据2,····,数据n]letarr=['小明','小刚','小红','小丽','小米']//使用数组console.log(arr)//同......
  • Js基础之数据类型
    1.基本数据类型number数字型string字符串型布尔型undefined未定义型null空类型引用数据类型object对象js弱数据类型的语言,只有当我们赋值了,才知道是什么数据类型letnum='pink'console.log(num)string类型letstr='pink'letstr="pink"letsr......
  • js之变量的 介绍
    用户输入的数据我们如何储存起来?1.变量就是个容器注意:变量不是数据本身,它们仅仅是一个用于存储数值的容器。可以理解为是一个个用来装东西的纸箱子。2.变量的基本使用一.声明变量:要想使用变量,首先需要创建变量(也称为声明变量或者定义变量)语法:let变量名声明变量......
  • SpringBoot:Web开发(基于SpringBoot使用MyBatis-Plus+JSP开发)
    目录前期准备构建项目(IDEA2023.1.2,JDK21,SpringBoot3.3.3)添加启动器Model准备这里我们利用MybatisX插件生成我们所需要的实体类、数据访问层以及服务层注意选择MyBatis-Plus3以及Lombok然后再在service接口中定义我们所需要的方法以及实现类(利用MyBatis-Plus省去我们......
  • [Java基础]基本数据类型
    Java的基本数据类型包括以下8种:byte(1字节):用于表示整数值,取值范围为-128到127。short(2字节):用于表示整数值,取值范围为-32768到32767。int(4字节):用于表示整数值,取值范围为-2147483648到2147483647。long(8字节):用于表示整数值,取值范围为-9223372036854775808到92......
  • JavaScript语法入门六 数据类型
    数据类型JavaScript数据类型有8种,分别是number、bigint、string、boolean、null、undefined、symbol、object。JavaScript是一种弱类型语言,或者说动态类型语言。即每一个变量的类型在定义之后可变化的,JavaScript根据使用情况自动识别。number类型整数、浮点数。范围:常规的数字、Inf......
  • 【数据结构】字符串与JSON字符串、JSON字符串及相应数据结构(如对象与数组)之间的相互转
    前言:下面打印日志用的是FastJSON依赖库中的 @Log4j2。依赖:<!--AlibabaFastjson--><dependency><groupId>com.alibaba</groupId><artifactId>fastjson</artifactId><version>1.2.80</version></dependency>目录普通字......
  • JS加载
    同步加载阻塞模式,提高安全性过多JS加载会影响页面效率默认情况下,JS是同步加载,及优先加载外部JS,只有当JS文件加载完成,don和css才开始加载<scriptsrc='index.js'></script>异步加载非阻塞加载动态创建scriptdefer延迟加载JS,等到HTML的DOM完全解析之后asyncHTML......