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 相关文章推荐
关于IE BUG与字符串截取substr的解决办法
Apr 10 Javascript
laytpl 精致巧妙的JavaScript模板引擎
Aug 29 Javascript
JavaScript实现向setTimeout执行代码传递参数的方法
Apr 16 Javascript
Bootstrap被封装的弹层
Jul 20 Javascript
JavaScript中捕获/阻止捕获、冒泡/阻止冒泡方法
Dec 07 Javascript
JS实现移动端按首字母检索城市列表附源码下载
Jul 05 Javascript
JS SetInterval 代码实现页面轮询
Aug 11 Javascript
纯js代码生成可搜索选择下拉列表的实例
Jan 11 Javascript
微信小程序picker组件关于objectArray数据类型的绑定方法
Mar 13 Javascript
详解如何在vue项目中使用layui框架及采坑
May 05 Javascript
vue中node_modules中第三方模块的修改使用详解
May 31 Javascript
JavaScript创建、读取和删除cookie
Sep 03 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
配置支持SSI
2006/11/25 PHP
解析PHPExcel使用的常用说明以及把PHPExcel整合进CI框架的介绍
2013/06/24 PHP
PHP引用返回用法示例
2016/05/28 PHP
PHP实现的文件操作类及文件下载功能示例
2016/12/24 PHP
php设计模式之模板模式实例分析【星际争霸游戏案例】
2020/03/24 PHP
Laravel中GraphQL接口请求频率实战记录
2020/09/01 PHP
一份老外写的XMLHttpRequest代码多浏览器支持兼容性
2007/01/11 Javascript
用js实现计算代码行数的简单方法附代码
2007/08/13 Javascript
在JavaScript中实现类的方式探讨
2013/08/28 Javascript
深入理解javascript中return的作用
2013/12/30 Javascript
浅谈JS如何实现真正的对象常量
2017/06/25 Javascript
Node.js微信 access_token ( jsapi_ticket ) 存取与刷新的示例
2017/09/30 Javascript
Python3基础之函数用法
2014/08/13 Python
通过代码实例展示Python中列表生成式的用法
2015/03/31 Python
Python实现返回数组中第i小元素的方法示例
2017/12/04 Python
python实现下载pop3邮件保存到本地
2018/06/19 Python
python2与python3中关于对NaN类型数据的判断和转换方法
2018/10/30 Python
Flask教程之重定向与错误处理实例分析
2019/08/01 Python
使用Python串口实时显示数据并绘图的例子
2019/12/26 Python
利用python实现平稳时间序列的建模方式
2020/06/03 Python
Python中有几个关键字
2020/06/04 Python
解决Keras TensorFlow 混编中 trainable=False设置无效问题
2020/06/28 Python
HTML5 CSS3实现一个精美VCD包装盒个性幻灯片案例
2014/06/16 HTML / CSS
Rossignol金鸡美国官网:始于1907年法国百年雪具品牌
2019/03/06 全球购物
入党转预备思想汇报
2014/01/07 职场文书
怎么写好自荐书
2014/03/02 职场文书
农村面貌改造提升实施方案
2014/03/18 职场文书
市场营销专业毕业生求职信
2014/03/26 职场文书
第二批党的群众路线教育实践活动总结报告
2014/10/30 职场文书
精神文明建设先进个人事迹材料
2014/12/24 职场文书
构建和谐校园倡议书
2015/01/19 职场文书
质量承诺书格式范文
2015/04/28 职场文书
领导干部学习心得体会
2016/01/23 职场文书
2016年“我们的节日·重阳节”主题活动总结
2016/04/01 职场文书
pytorch fine-tune 预训练的模型操作
2021/06/03 Python
总结三种用 Python 作为小程序后端的方式
2022/05/02 Python