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 相关文章推荐
Js 弹出框口并返回值的两种常用方法
Dec 30 Javascript
JSONP 跨域访问代理API-yahooapis实现代码
Dec 02 Javascript
javascript常用方法总结
May 14 Javascript
Express实现前端后端通信上传图片之存储数据库(mysql)傻瓜式教程(二)
Dec 10 Javascript
Uploadify上传文件方法
Mar 16 Javascript
JS简单获取当前年月日星期的方法示例
Feb 07 Javascript
防止重复发送 Ajax 请求
Feb 15 Javascript
js 奇葩技巧之隐藏代码
Aug 11 Javascript
vue复合组件实现注册表单功能
Nov 06 Javascript
基于angular6.0实现的一个组件懒加载功能示例
Apr 12 Javascript
初试vue-cli使用HBuilderx打包app的坑
Jul 17 Javascript
vue制作抓娃娃机的示例代码
Apr 17 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
浅析php工厂模式
2014/11/25 PHP
Apache服务器下防止图片盗链的办法
2015/07/06 PHP
php fread读取文件注意事项
2016/09/24 PHP
javascript实现划词标记+划词搜索功能
2007/03/06 Javascript
jquery下操作HTML控件的实现代码
2010/01/12 Javascript
用jquery实现动画跳到顶部和底部(这个比较简单)
2014/09/01 Javascript
基于JavaScript如何实现私有成员的语法特征及私有成员的实现方式
2015/10/28 Javascript
js仿腾讯QQ的web登陆界面
2016/08/19 Javascript
jquery层级选择器的实现(匹配后代元素div)
2016/09/05 Javascript
js设置和获取自定义属性的方法
2016/10/20 Javascript
etmvc+jQuery EasyUI+combobox多值操作实现角色授权实例
2016/11/09 Javascript
详解js产生对象的3种基本方式(工厂模式,构造函数模式,原型模式)
2017/01/09 Javascript
jQuery在header中设置请求信息的方法
2017/03/06 Javascript
ES6新特性之模块Module用法详解
2017/04/01 Javascript
jQuery复合事件结合toggle()方法的用法示例
2017/06/10 jQuery
vue项目部署上线遇到的问题及解决方法
2018/06/10 Javascript
[01:18:43]2014 DOTA2华西杯精英邀请赛5 24 iG VS DK
2014/05/25 DOTA
Python面向对象之继承和组合用法实例分析
2018/08/27 Python
wxPython的安装与使用教程
2018/08/31 Python
python实现的生成word文档功能示例
2019/08/23 Python
python随机模块random使用方法详解
2020/02/14 Python
基于matplotlib xticks用法详解
2020/04/16 Python
Python的scikit-image模块实例讲解
2020/12/30 Python
会计电算化学生个人的自我评价
2014/02/08 职场文书
赔偿协议书范本
2014/04/15 职场文书
活动宣传策划方案
2014/05/23 职场文书
标准毕业生自荐信
2014/06/24 职场文书
单位工作证明格式模板
2014/10/04 职场文书
助学金感谢信
2015/01/20 职场文书
公司优秀员工推荐信
2015/03/24 职场文书
2016春节家属慰问信
2015/03/25 职场文书
2016年公司中秋节致辞
2015/11/26 职场文书
看看如何用Python绘制小米新版天价logo
2021/04/20 Python
python数据分析之用sklearn预测糖尿病
2021/04/22 Python
Pytorch distributed 多卡并行载入模型操作
2021/06/05 Python
css filter和getUserMedia的联合使用
2022/02/24 HTML / CSS