JS判断数据类型的常用方法汇总

 更新时间:2023年06月07日 15:55:45   作者:前端小蜜蜂来也  
判断数据类型是JavaScript面试时常常遇到的问题,本文为大家总结了几种常用的方法,文中的示例代码讲解详细,感兴趣的小伙伴可以了解一下

在搬砖途中看到一大神的代码,用 Object.prototype.toString.call()判断数据类型,在这里学习总结下,在js中,判断数据类型除了用typeof运算符之外,还可以用Object.prototype.toString.call()方法、instanceof操作符。

几种判断方法的区别

typeof判断数据类型

使用typeof操作符,判断数据类型返回值如下:

    typeof 1 // "number"
    typeof "a" // "string"
    typeof true // "boolean"
    typeof {} // "object"
    typeof [] // "object"
    typeof function(){} // "function"

使用时的一个问题是,在判断数组和对象存储值时,都返回”object”。

Object.prototype上的原生toString()方法判断数据类型

Object.prototype.toString.call()方法既可以判断基本类型,也可以判断原生引用类型,还可以判断原生JSON对象。

判断基本类型

数字number、字符串string、布尔值boolean。

Object.prototype.toString.call(2);//"[object Number]"
Object.prototype.toString.call("s");//"[object String]"
Object.prototype.toString.call(true);//"[object Boolean]"

判断空类型

null和undefined。

Object.prototype.toString.call(null);//"[object Null]"
Object.prototype.toString.call(undefined);//"[object Undefined]"

判断复合类型

对象Object、数组Array、方法Function、日期Date、布尔Boolean、数字Number、字符串String、正则RegExp、Math。

例如上面例子中的引用类型存储值就可以使用Object.prototype.toString()方法区别出来:

Object.prototype.toString.call({});//"[object Object]"
Object.prototype.toString.call([]);//"[object Array]"
Object.prototype.toString.call(function(){});//"[object Function]"
Object.prototype.toString.call(String);//"[object Function]"
var t = new Date();
Object.prototype.toString.call(t);//"[object Date]"
var bb = new Boolean();
Object.prototype.toString.call(bb);//"[object Boolean]"
var bb = new Number();
Object.prototype.toString.call(bb);//"[object Number]"
var str = new String();
Object.prototype.toString.call(str);//"[object String]"
var reg = new RegExp("^1[34578][0-9]{9}$","g");
Object.prototype.toString.call(reg);//"[object RegExp]"
var reg = Math.valueOf();
Object.prototype.toString.call(reg);//"[object Math]"

判断原生JSON对象

var isNativeJSON = window.JSON && Object.prototype.toString.call(JSON);
console.log(isNativeJSON);//[object JSON]

判断自定义类型

function Foo(name,age) {
this.name = name;
this.age = age;
}
var foo =new Foo("harry",20);
Object.prototype.toString.call(foo);//"[object Object]"

遇到的一个问题是,使用Object.prototype.toString.call()方法不能判断foo是Foo类的实例。只能用instanceof来判断。

instanceof判断数据类型

instanceof作用是判断原型与实例之间的关系。用法是:

instanceof 原型

instanceof操作符会在实例的原型链上查找,直到找到右边构造函数的prototype属性,或者为null的时候停止。

console.log(foo instanceof Foo);//true

到此这篇关于JS判断数据类型的常用方法汇总的文章就介绍到这了,更多相关JS判断数据类型内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • js模糊查询实例分享

    js模糊查询实例分享

    本文主要分享了js模糊查询的实现代码,没有接触到后台数据的知识,只是查询当前表格中每一行所包含的关键字。具有一定的参考价值,需要的朋友一起来看下吧
    2016-12-12
  • 无缝滚动js代码通俗易懂(自写)

    无缝滚动js代码通俗易懂(自写)

    本人闲暇时自写的无缝滚动js,代码简单实用,通俗易懂,晒出来与大家共享,感兴趣的朋友可以参考下哈
    2013-06-06
  • 微信小程序实现手风琴折叠面板

    微信小程序实现手风琴折叠面板

    这篇文章主要为大家详细介绍了微信小程序实现手风琴折叠面板,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-05-05
  • 前端程序员必须知道的高性能Javascript知识

    前端程序员必须知道的高性能Javascript知识

    这篇文章主要为大家详细介绍了前端程序员必须知道的高性能Javascript知识,感兴趣的小伙伴们可以参考一下
    2016-08-08
  • js点击出现悬浮窗效果不使用JQuery插件

    js点击出现悬浮窗效果不使用JQuery插件

    JQuery有很多这样的插件,但本文的这个是跟着自己的想法写的,也不知道他人是如何实现的,感兴趣的朋友可以了解下
    2014-01-01
  • Bootstrap源码解读排版(1)

    Bootstrap源码解读排版(1)

    这篇文章主要源码解读了Bootstrap排版,介绍了Bootstrap排版的使用方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-12-12
  • JavaScript编程的10个实用小技巧

    JavaScript编程的10个实用小技巧

    尽管我使用Javascript来做开发有很多年了,但它常有一些让我很惊讶的小特性。对于我来说,Javascript是需要持续不断的学习的。
    2014-04-04
  • JavaScript使用Base64编码和Blob对象加密图像url地址

    JavaScript使用Base64编码和Blob对象加密图像url地址

    有时候会看到一些网站的图片src中是blob:http://example.com/7c672acb-375c-4a26-9af9-99cb4c77f04d,这样的图片加载怎么实现呢?本文讲解在浏览器中JavaScript使用解析Base64编码和Blob对象技术来实现,下面是实现的步骤和相应的示例代码,
    2023-12-12
  • Javascript中document.referrer隐藏来源的方法

    Javascript中document.referrer隐藏来源的方法

    这篇文章主要介绍了Javascript中document.referrer隐藏来源的方法,文中通过一个实例给大家介绍了实现的方法,有需要的朋友可以参考借鉴,下面来一起学习学习吧。
    2017-01-01
  • KnockoutJS 3.X API 第四章之表单value绑定

    KnockoutJS 3.X API 第四章之表单value绑定

    Knockout是一个以数据模型(data model)为基础的能够帮助你创建富文本,响应显示和编辑用户界面的JavaScript类库。这篇文章主要介绍了KnockoutJS 3.X API 第四章之表单value绑定的相关资料,需要的朋友可以参考下
    2016-10-10

最新评论