JS数据类型分类及常用判断方法


Posted in Javascript onNovember 19, 2020

数据类型判断的方法

在探索数据类型判断方法的时候我们需要知道JS中有哪些数据类型:

我们可以把JS中数据类型分为两类:

1.基本数据类型:Undefined、Null、Boolean、Number、String、Symbol(es6中新增)

2.引用类型(复杂数据类型):里面包含 function、Array、Date 等

判断数据类型的方法有几种

1.typeof

我相信typeof这个判断数据类型的方法是大家平常用的比较多的,闲话不多说,直接上代码:

console.log(typeof 1);//number
console.log(typeof 'hello');//string
console.log(typeof true);//boolean
console.log(typeof null);//object
console.log(typeof Symbol(1));//symbol
console.log(typeof undefined);//undefined
console.log(typeof function(){});//function
console.log(typeof []);//object
console.log(typeof {});//object

通过以上代码和输出我们大概可以看出,typeof这个判断能判断出大部分的数据类型,但是基本类型中有null的类型被判断为object

所以这个判断还不是那么精确,我们需要其它判断方法

2.instanceof 用于检测构造函数的 prototype 属性是否出现在某个实例的原型链上

1.instanceof 左为实例,右为构造函数。即判断左是不是右的实例对象。内部机制是通过原型链来判断的

2.instanceof 可以精准判断引用数据类型 Array,Function,Object,而基本数据类型不能被 instanceof 精准判断,因为它本身不是一个实例对象

console.log(2 instanceof Number);//false
console.log(new Number(2) instanceof Number);//true
console.log('str' instanceof String); //false
console.log(new String('str') instanceof String); //true
console.log([] instanceof Array);//true
console.log([]instanceof Object);//true
console.log({} instanceof Object);//true
console.log({} instanceof Array);//false
console.log(function(){} instanceof Function); // true 

在以上代码中,我们可以看出这个判断方法还是没解决实际性的问题,比如我们想判断null为null,所以接下来介绍一个精确的判断方法

3.Object.prototype.toString.call()

1.使用 Object 对象的原型方法 toString,使用 call 改变 this 指向

见代码:

const a = Object.prototype.toString;
console.log(a.call(2)); // [object Number]
console.log(a.call(true)); // [object Boolean]
console.log(a.call('str')); // [object String]
console.log(a.call(Symbol())) // [object Symbol]
console.log(a.call([])); // [object Array]
console.log(a.call(function(){})); // [object Function]
console.log(a.call({})); // [object Object]
console.log(a.call(undefined)); // [object Undefined]
console.log(a.call(null)); // [object Null]
console.log(a.call(new Date())) // [object Date]
console.log(a.call(new Error())) // [object Error]
console.log(a.call(new RegExp())) // [object RegExp

见上面输出可知,Object.prototype.toString.call()可以判断出复杂类型中的Array,Function,Date等类型,所以我们知道,当我们需要判断复杂类型时,或者判断简单数据类型中的null为null时我们可以用次方法,判断简单类型中的其他数据类型我们可以用typeof来判断就可以

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
为Extjs加加速(javascript加速)
Aug 19 Javascript
js常用排序实现代码
Dec 28 Javascript
js获取当前时间显示在页面上并每秒刷新
Dec 24 Javascript
javascript设计模式之中介者模式Mediator
Dec 30 Javascript
js实现精美的银灰色竖排折叠菜单
May 16 Javascript
boostrapTable的refresh和refreshOptions区别浅析
Jan 22 Javascript
详解angular2封装material2对话框组件
Mar 03 Javascript
捕获未处理的Promise错误方法
Oct 13 Javascript
详解Vue CLI 3.0脚手架如何mock数据
Nov 23 Javascript
vue中img src 动态加载本地json的图片路径写法
Apr 25 Javascript
koa2 数据api中间件设计模型的实现方法
Jul 13 Javascript
完美解决vue 中多个echarts图表自适应的问题
Jul 19 Javascript
JavaScript构造函数原理及实现流程解析
Nov 19 #Javascript
javascript this指向相关问题及改变方法
Nov 19 #Javascript
JavaScript实现alert弹框效果
Nov 19 #Javascript
Vue 打包的静态文件不能直接运行的原因及解决办法
Nov 19 #Vue.js
如何使用 vue-cli 创建模板项目
Nov 19 #Vue.js
原生js实现自定义消息提示框
Nov 19 #Javascript
原生js实现点击按钮复制内容到剪切板
Nov 19 #Javascript
You might like
PHP4 与 MySQL 数据库操作函数详解
2006/10/09 PHP
php递归列出所有文件和目录的代码
2008/09/10 PHP
Windows IIS PHP 5.2 安装与配置方法
2009/06/08 PHP
PHP SOCKET编程详解
2015/05/22 PHP
详解PHP处理字符串类似indexof的方法函数
2017/06/11 PHP
js中直接声明一个对象的方法
2014/08/10 Javascript
jQuery支持动态参数将函数绑定到事件上的方法
2015/03/17 Javascript
js绘制圆形和矩形的方法
2015/08/05 Javascript
jquery实现Slide Out Navigation滑出式菜单效果代码
2015/09/07 Javascript
Eclipse编辑jsp、js文件时卡死现象的解决办法汇总
2016/02/02 Javascript
jQuery代码实现图片墙自动+手动淡入淡出切换效果
2016/05/09 Javascript
原生JS实现轮播效果+学前端的感受(防止走火入魔)
2016/08/21 Javascript
Javascript实现倒计时(防页面刷新)实例
2016/12/13 Javascript
javascript 网页进度条简单实例
2017/02/22 Javascript
jQuery动态产生select option下拉列表
2017/03/15 Javascript
vue.js中使用echarts实现数据动态刷新功能
2019/04/16 Javascript
解决layui动态加载复选框无法选中的问题
2019/09/20 Javascript
基于JQuery实现页面定时弹出广告
2020/05/08 jQuery
Cython 三分钟入门教程
2009/09/17 Python
python回调函数的使用方法
2014/01/23 Python
Python将DataFrame的某一列作为index的方法
2018/04/08 Python
python3 爬取图片的实例代码
2018/11/06 Python
Python数据可视化教程之Matplotlib实现各种图表实例
2019/01/13 Python
Python udp网络程序实现发送、接收数据功能示例
2019/12/09 Python
python 爬取古诗文存入mysql数据库的方法
2020/01/08 Python
jupyter notebook 重装教程
2020/04/16 Python
澳大利亚自然和有机的健康美容产品一站式商店:Ziani Beauty
2017/12/28 全球购物
银行实习生的自我评价
2013/12/09 职场文书
环境工程专业自荐信范文
2014/03/18 职场文书
房屋买卖协议书范本
2014/04/10 职场文书
幼儿生日活动方案
2014/08/27 职场文书
《学会看病》教学反思
2016/02/17 职场文书
高中数学教学反思范文
2016/02/18 职场文书
浅谈Python实现opencv之图片色素的数值运算和逻辑运算
2021/06/23 Python
ipad隐藏软件app图标方法
2022/04/19 数码科技
Python 装饰器(decorator)常用的创建方式及解析
2022/04/24 Python