js 数据类型_js中检测数据类型的方法汇总
回顾一下js中数据类型分为两大类,基础类型和引用数据类型,主要有:
基本数据类型
- Number
- String
- Boolean
- Null
- Undefined
- Symbol
复杂数据类型
- Array
- Function
- Object
检测js中的数据类型常用的方法有:
- typeof
- instanceof
- Object.prototype.toString
对比一下这三种方法的优缺点:
typeof方法
typeof 5 // number 有效typeof 'dsd' // string 有效typeof true // boolean 有效typeof undefined // undefined 有效typeof function(){} // function 有效typeof null // object 无效typeof [] // object 无效typeof {} // object 无效
从以上例子中可以看到:
- typeof 用来检测基本数据类型,除了Null无效外,其他都能返回正确的结果;
- 但引用类型,除了function外,其他引用类型一律都返回object结果。
Note:这在需要对数据结构进行详细划分的时候就不适用,比如说你要明确区分数组和对象,然后进行处理的时候,typeof就完全达不到效果
好处:检测快捷方便
坏处:不能检测更为准确的数据类型,如Array、Object、Null
instanceof
MDN: 用于检测构造函数的 prototype 属性是否出现在某个实例对象的原型链上。
[] instanceof Array; // true{} instanceof Object; // truenewDate() instanceof Date; // truefunction Person(){};newPerson() instanceof Person; // true[] instanceof Object; // truenewDate() instanceof Object; // truenewPerson instanceof Object; // true
由上面例子可以看出:
- instanceof确实可以检测部分引用数据类型
- []是Array的实例,也是Object的实例
模拟instanceof的检测过程
instanceof (A, B) = { var L = A.__proto__; var R = B.prototype; if(L === R) { return true; // A的内部属性 __proto__ 指向 B 的原型对象 } return false;}
instanceof 只能用来判断两个对象是否属于实例关系, 而不能判断一个对象实例具体属于哪种类型。
由此可见instanceof在有些场景下依然不能满足检测具体类型的需求。
toString
toString是Object的原型方法。调用该方法默认返回当前对象的[[class]]
这是一个内部属性,其格式为 [object Xxx] ,其中 Xxx 就是对象的类型。
Object.prototype.toString.call(5) // "[object Number]"Object.prototype.toString.call('str') // "[object String]"Object.prototype.toString.call(true) // "[object Boolean]"Object.prototype.toString.call(undefined) // "[object Undefined]"Object.prototype.toString.call(null) // "[object Null]"Object.prototype.toString.call(function(){}) // "[object Function]"Object.prototype.toString.call([]) // "[object Array]"Object.prototype.toString.call({}) // "[object Object]"
由上可见toString检测各数据类型算非常准确了,基本上覆盖了我们常用的数据类型
所以是判断数据类型最常用的方法。
这里利用toString写一个检测数据类型的方法
function checkDataType(value) { const typeObj = Object.prototype.toString.call(value) return typeObj.slice(8, -1)}
同时,Array对象提供isArray方法来检测数据是否为数组对象
Array.isArray([1,2,4]) // trueArray.isArray({foo: 'abc'}) // false
该方法用来检测数组类型也是非常方便的。
喜欢的话,公众号记得关注哦,不定时更新前端小技巧哦!!
![](/assets/blank.gif)
js 数据类型_js中检测数据类型的方法汇总相关推荐
- React-Native中Animate动画使用方法汇总整理(六)之缩放的实现
React-Native中Animate动画使用方法汇总整理(六)之缩放的实现 写作时间:2021/9/24 React-Native版本:0.63.2 目标平台:iOS(安卓平台尚未检测) 整理的进 ...
- React-Native中Animate动画使用方法汇总整理(四)之timing利用easing实现动画的灵活变换
React-Native中Animate动画使用方法汇总整理(四)之timing利用easing实现动画的灵活变换 写作时间:2021/9/23 React-Native版本:0.63.2 目标平台: ...
- React-Native中Animate动画使用方法汇总整理(一)之简单动画的实现
React-Native中Animate动画使用方法汇总整理(一)之简单动画的实现 写作时间:2021/9/23 React-Native版本:0.63.2 目标平台:iOS(安卓平台尚未检测) RN ...
- js如何操作表格(常用属性方法汇总)
js如何操作表格(常用属性方法汇总) 一.总结 一句话总结: 二.表格相关的属性和方法 1.1 Table 对象集合 cells[] 返回包含表格中所有单元格的一个数组. 语法:tableObject ...
- 统计计量 | 统计学中常用的数据分析方法汇总
来源:数据Seminar本文约10500字,建议阅读15+分钟 统计学中常用的数据分析方法汇总. Part1描述统计 描述统计是通过图表或数学方法,对数据资料进行整理.分析,并对数据的分布状态.数字特 ...
- java异或运算结果数据类型_java中的数据类型和运算符的总结归类。
首先学习java肯定先要了解java的发展史,以及java的特点,常见的dos命令,jdk的安装,如何开发java程序等等一下概念行的东西,这里面我都不一一说了. 今天这一章主要想总结一下java中的 ...
- python中什么是主要数据类型_python中基本数据类型是什么
python中基本数据类型是什么,变量,整型,类型,赋值,等号 python中基本数据类型是什么 易采站长站,站长之家为您整理了python中基本数据类型是什么的相关内容. python中基本数据类型 ...
- r如何查询mysql中的数据类型_MySQL-mysql中的数据类型
mysql中的数据类型 数值类型 严格数值数据类型(INTEGER.SMALLINT.DECIMAL和NUMERIC), 关键字INT是INTEGER的同义词,关键字DEC是DECIMAL的同义词. ...
- c ++基本数据类型_C ++中的数据类型
c ++基本数据类型 Data types help the associated variables understand the type of data they can store into ...
最新文章
- 2019年终总结:好好爱自己
- 不止最佳长论文,腾讯AI在ACL上还有这些NLP成果
- 关于ARP、MAC、IP欺骗以及TCP劫持
- 小白学python买什么书-书单狗 篇一:小白学Python,到底要看多少书?
- 从零开始入门 K8s | 理解 RuntimeClass 与使用多容器运行时
- 3月16日 winform
- (九)HTML5本地存储——本地数据库SQLLite的使用
- USACO Training Section 1.2 挤牛奶Milking Cows
- android 按钮带图标 阴影_android中带图标的按钮(ImageButton)怎么用
- 关于数据统计时的效率
- 随想录(什么是软件架构师)
- linux 树状目录代码,Linux tree - 以树状图列出目录的内容
- item_search_img - 拍立淘搜索淘宝商品(淘宝API)
- PHP字体间距设置,wps字间距怎么调整
- 世界电信日| 谈谈电信行业缘何牵线云计算?
- mysql积累--索引
- 阿朱,是时候拥抱 Linux 了!
- NB-IoT技术实战开发----keil安装和使用
- Redis 的主从复制
- 汇编语言 CMP指令
热门文章
- Python内置函数查询表——总结篇
- 2020年电大c语言程序设计作业1答案,2019年最新电大C语言程序设计作业答案.doc
- html类型转换函数,如何在JavaScript中转换数据类型?
- c++中结构体套结构体用 = {0}初始化编译报错解决办法(用memset或者={})(error: invalid conversion)
- Intel Realsense D435 开始运行启动时报错:RuntimeError: Couldn't resolve requests 原因及解决办法
- 黑马程序员pink老师前端入门教程,零基础必看的JavaScript基础语法视频教程(二)
- 绝命沙虫 精度,double,模拟 牛客白月赛44
- xay loves or 异或
- Java进阶:AtomicReference详解
- java中的“”、“|”、“^”、“~”运算符怎么用?