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 相关文章推荐
让回调函数 showResponse 也带上参数的代码
Aug 13 Javascript
不能再简单的无闪刷新验证码原理很简单
Nov 05 Javascript
javascript showModalDialog 内跳转页面的问题
Nov 25 Javascript
js日期时间补零的小例子
Mar 05 Javascript
JS格式化数字保留两位小数点示例代码
Oct 15 Javascript
seajs加载jquery时提示$ is not a function该怎么解决
Oct 23 Javascript
深入剖析JavaScript面向对象编程
Jul 12 Javascript
Vue 固定头 固定列 点击表头可排序的表格组件
Nov 25 Javascript
JavaScript设计模式之构造函数模式实例教程
Jul 02 Javascript
在create-react-app中使用sass的方法示例
Oct 01 Javascript
vue实现todolist功能、todolist组件拆分及todolist的删除功能
Apr 11 Javascript
深入浅析vue中cross-env的使用
Sep 12 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
DC的38部超级英雄动画电影
2020/03/03 欧美动漫
实例讲解php数据访问
2016/05/09 PHP
laravel5.1框架基础之Blade模板继承简单使用方法分析
2019/09/05 PHP
ThinkPHP6.0如何利用自定义验证规则规范的实现登陆
2020/12/16 PHP
php的单例模式及应用场景详解
2021/02/27 PHP
document.compatMode介绍
2009/05/21 Javascript
解决jQuery插件tipswindown与hintbox冲突
2010/11/05 Javascript
Extjs中ComboBox加载并赋初值的实现方法
2012/03/22 Javascript
Javascript让DEDECMS告别手写Tag
2014/09/01 Javascript
Javascript实现商品秒杀倒计时(时间与服务器时间同步)
2015/09/16 Javascript
跟我学习javascript的闭包
2015/11/16 Javascript
详解AngularJS中的filter过滤器用法
2016/01/04 Javascript
javascript基础知识分享之类与函数化
2016/02/13 Javascript
js获取页面引用的css样式表中的属性值方法(推荐)
2016/08/19 Javascript
vue.js默认路由不加载linkActiveClass问题的解决方法
2017/12/11 Javascript
Vue-cli项目获取本地json文件数据的实例
2018/03/07 Javascript
react配置antd按需加载的使用
2019/02/11 Javascript
vue-element-admin 菜单标签失效的解决方式
2019/11/12 Javascript
jQuery实现颜色打字机的完整代码
2020/03/19 jQuery
一篇文章带你使用Typescript封装一个Vue组件(简单易懂)
2020/06/05 Javascript
PyQt5每天必学之关闭窗口
2018/04/19 Python
详解Python最长公共子串和最长公共子序列的实现
2018/07/07 Python
python-opencv 将连续图片写成视频格式的方法
2019/01/08 Python
Python3基础教程之递归函数简单示例
2019/06/07 Python
Python 操作 ElasticSearch的完整代码
2019/08/04 Python
Python3 pandas 操作列表实例详解
2019/09/23 Python
python实现树的深度优先遍历与广度优先遍历详解
2019/10/26 Python
美国时尚在线:Showpo
2017/09/08 全球购物
在Java开发中如何选择使用哪种集合类
2016/08/09 面试题
企业文化建设实施方案
2014/03/22 职场文书
降消项目实施方案
2014/03/30 职场文书
群众路线教育实践活动个人对照检查材料
2014/09/22 职场文书
党支部季度考核意见
2015/06/02 职场文书
Python+Appium新手教程
2021/04/17 Python
详解python的异常捕获
2022/03/03 Python
PYTHON 使用 Pandas 删除某列指定值所在的行
2022/04/28 Python