细数判断数据类型的各种方法
数据类型的分类
要想判断数据类型,首先要知道数据类型的分类。数据类型分为基本数据类型和引用数据类型。
基本数据类型
基本数据类型有 五 种,ES6中新加了第 六 种基本数据类型——Symbol 类型。
- 数值 (number): 整数和小数。
- 字符串 (string): 文本
- 布尔值 (boolean):true 和 false 。
- undefined: 表示‘未定义’或不存在。一般情况下变量在声明后未赋值前都是undefined。
- null: 空值。
- symbol: ES6 引入的新原始数据类型,表示独一无二的值。
引用数据类型
引用类型数据也会统称为对象,即广义的对象,通常除了基本数据类型的其它数据都属于引用类型数据。
- 对象 (object): 狭义的对象,
{key1:value1, key2:value2,...}
- 数组 (array):
[value1,value2,...]
- 函数 (function)
- 日期 (date)
- 正则表达式 (RegExp)
- ......
数据类型综合判断的各种方法
typeof 运算符
typeof
返回字符串,number
、string
、boolean
、symbol
、undefined
、function
,所有其它的引用类型数据都返回 object
,null
也返回 object
。
typeof 666 // "number"
typeof 'dora' // "string"
typeof true // "boolean"
typeof Symbol() // "symbol"
typeof undefined // "undefined"
typeof null // "object"
typeof function(){} // "function"
typeof [] // "object"
typeof /dora/ // "object"
优点
可利用判断 undefined
来检查一个没有声明的变量,而不报错。实际编程中,这个特点通常用在判断语句中。
// 错误的写法
if (v) {// ...
}
// ReferenceError: v is not defined// 正确的写法
if (typeof v === "undefined") {// 这种写法在 v 没有声明的时候不会报错。
}
注意
ES6中引入了 let
之后,这个方法也不是万能的了。当变量在代码块内用 let
声明的时候,会形成“暂时性死区”(temporal dead zone,简称 TDZ),此时这个方法就没用了,typeof 还是会报错。
typeof x; // ReferenceError
let x;
缺点
不能准确的判断引用类型数据的具体类型,除了函数外,其余的都是返回object
。
typeof {} // "object"
typeof [] // "object"
此时,在需要判断数组或者对象时,就不适用了。
Object.prototype.toString.call(value)
Object.prototype.toString()
方法返回对象的类型字符串,因此可以用来判断一个值的类型。
var obj = {};
obj.toString() // "[object Object]"
上面代码调用空对象的toString方法,结果返回一个字符串 object Object
,其中第二个Object表示该值的 构造函数。
由于实例对象可能会自定义toString方法,覆盖掉 Object.prototype.toString
方法,所以为了得到类型字符串,最好直接使用Object.prototype.toString
方法。通过函数的call
方法,可以在任意值上调用这个方法,帮助我们判断这个值的类型。
Object.prototype.toString.call(value)
上面代码表示对value这个值调用Object.prototype.toString
方法。
返回值
不同数据类型的Object.prototype.toString
方法返回值如下:
- 数值:返回
[object Number]
。 - 字符串:返回
[object String]
。 - 布尔值:返回
[object Boolean]
。 - undefined:返回
[object Undefined]
。 - null:返回
[object Null]
。 - Symbol类型:返回
[object Symbol]
。 - 数组:返回
[object Array]
。 - arguments 对象:返回
[object Arguments]
。 - 函数:返回
[object Function]
。 - Error 对象:返回
[object Error]
。 - Date 对象:返回
[object Date]
。 - RegExp 对象:返回
[object RegExp]
。 - 其他对象:返回
[object Object]
。
Object.prototype.toString.call(2) // "[object Number]"
Object.prototype.toString.call('') // "[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(Symbol()) // "[object Symbol]"
Object.prototype.toString.call(Math) // "[object Math]"
Object.prototype.toString.call({}) // "[object Object]"
Object.prototype.toString.call([]) // "[object Array]"
封装实用函数
利用这个特性,可以封装一个比typeof
运算符更准确的类型判断函数。
var type = function (o){var s = Object.prototype.toString.call(o);return s.match(/\[object (.*?)\]/)[1].toLowerCase();
};type({}); // "object"
type([]); // "array"
type(5); // "number"
type(null); // "null"
type(); // "undefined"
type(/dora/); // "regexp"
type(new Date()); // "date"
在上面这个type函数的基础上,还可以加上专门判断某种类型数据的方法。
var dataArr = ['Null', 'Undefined', 'Object', 'Array', 'String', 'Number', 'Boolean', 'Function', 'RegExp'];dataArr.forEach(function (t) {type['is' + t] = function (o) {return type(o) === t.toLowerCase();};});type.isObject({}); // truetype.isNumber(NaN); // truetype.isRegExp(/abc/); // true
instanceof 运算符
instanceof
运算符返回一个布尔值,表示对象是否为某个构造函数的实例。
function People(){}
var person = new People();
person instanceof People // true
判断原理
遍访对象的原型链上的每个原型对象,如果遍访到这个原型对象,是某个构造函数的prototype
,那么就认为对象是这个构造函数的实例,返回true。因此同一个实例对象,可能会对多个构造函数都返回true,因为继承的子类实例也是父类的实例。
var d = new Date();
d instanceof Date // true
d instanceof Object // true
特殊情况
有一种特殊情况,就是左边对象的原型链上,只有null对象。这时,instanceof
判断会失真。
var obj = Object.create(null);
typeof obj // "object"
obj instanceof Object // false
上面代码中,Object.create(null)
返回一个新对象obj
,它的原型是null
。右边的构造函数Object
的prototype
属性,不在左边的原型链上,因此instanceof
就认为obj
不是Object
的实例。
只要一个对象的原型不是null
,instanceof
运算符的判断就不会失真。
类型判断
instanceof
运算符只能用于对象,不适用原始类型的值,且对于undefined
和null
,instanceof
运算符总是返回false
。
'hello' instanceof String // false
undefined instanceof Object // false
null instanceof Object // false
可用于对象,无论是 JavaScript 内置对象或是自定义构造函数生成的对象,都可进行判断。
[] instanceof Array // true
({}) instanceof Object // true
(function(){}) instanceof Function // true
/a/ instanceof RegExp // true
new Date() instanceof Date // true
person instanceof People // true
constructor 属性
prototype
对象有一个constructor
属性,默认指向prototype
对象所在的构造函数。由于constructor
属性定义在prototype
对象上面,意味着可以被所有实例对象继承。因此,正常情况下,所有对象实例都有一个constructor
属性,属性值指向构造此对象实例的构造函数。
[].constructor === Array // true
[].constructor === Object // false
window.constructor === Window //true
name属性
如果不能确定对象实例的constructor
属性是什么函数,可通过函数的name
属性,从实例得到构造函数的名称。
function Foo() {}
var f = new Foo();
f.constructor.name // "Foo"
类型判断
基本数据类型
null
和undefined
是无效的对象,因此是不会有constructor
存在的,这两种类型的数据需要通过typeof
来判断。
number
、string
、boolean
三种数据类型有对应的Number
、String
、Boolean
三个原生对象(包装对象)。因此,也可用 constructor
进行判断。symbol
类型也可判断。
(333).constructor.name // "Number"
''.constructor.name // "String"
false.constructor.name // "Boolean"
Symbol().constructor.name // "Symbol"
引用数据类型
JavaScript 内置对象或是自定义构造函数生成的对象,都可进行判断。
new Date().constructor === Date //true
[].constructor === Array //truefunction F(){};
var f = new F();
f.constructor === F // true
f.constructor === Object // false
不稳定因素
constructor
属性表示原型对象与构造函数之间的关联关系,有时开发者会因业务关系重写prototype
,原有的constructor
会丢失,若没有同时修改constructor
属性,引用的时候就会出错,constructor
会默认为Object
。
function Person(name) {this.name = name;
}Person.prototype.constructor === Person // truePerson.prototype = {method: function () {}
};Person.prototype.constructor === Person // false
Person.prototype.constructor === Object // true
因此,修改原型对象时,一般要同时修改constructor
属性的指向,或者只在原型对象上添加方法,不要重写prototype
。
总结
typeof
typeof
可用来判断基本数据类型和函数,不可以对引用数据类型进行具体的判断。
Object.prototype.toString.call(value)
Object.prototype.toString.call(value)
可用于判断多种数据类型:基本数据类型和 JavaScript 内置对象,然而对于一些自定义构造函数生成的对象就不能进行判断了。
instanceof
instanceof
运算符不适用判断原始类型的值,只能用于判断对象,无论是 JavaScript 内置对象或是自定义构造函数生成的对象,都可进行判断。然而由于继承的存在,instanceof
判断也不完全准确,只能用来判断两个对象是否属于原型链的关系,而不一定能获取对象的具体类型。
constructor
constructor
属性可准确的判断对象实例是由哪个构造函数生成的,但自定义构造函数生成的对象,往往会因为重写prototype
造成constructor
属性指向不准确,因此使用的时候也要注意一下。
一些其它的具体类型判断
判断变量是否为对象(引用类型)
Object(x)
的参数为对象时,总是返回该对象,不做转换;当参数为原始类型时,会转换为对应的包装对象的实例,参数为空或者undefined
或者null
时,返回一个空对象。
function isObject(value) {return value === Object(value);
}
isObject([]); // true
isObject(true); // false
判断是不是 NaN
所有数据类型中,只有NaN
不等于它本身
function isNaN(value) {return value !== value;
}
isNaN(NaN); // true
判断数组的方法 Array.isArray()
除了上文提到的三种方法(toString()
、instanceof
、constructor
)可判断外,还有一个Array
构造函数自带的方法isArray()
可判断。
Array.isArray(x)
如果x
是数组,则为true
; 否则为false
。
Array.isArray([]); // true
Array.isArray(new Array()); // true
Array.isArray(Array.prototype); // true 鲜为人知的事实:其实 Array.prototype 也是一个数组。
使用之前需检测一下兼容性,对于不兼容的浏览器可使用下面的代码创建该方法。
if (!Array.isArray) {Array.isArray = function(arg) {return Object.prototype.toString.call(arg) === '[object Array]';};
}
原文地址:https://segmentfault.com/a/1190000016888845
转载于:https://www.cnblogs.com/lalalagq/p/9898423.html
细数判断数据类型的各种方法相关推荐
- js判断数据类型常用的方法
目录 基本数据类型有哪些 常见的判断js数据类型的方法有如下几种 一.typeof 二.instance of 三. 使用constructor判断数据类型 四.对象原型链判断方法:Object.pr ...
- 前端判断数据类型的通用方法
前端有时候需要判断数据的类型,这个时候很多人都会联想到typeof 或者 是 instanceof.但是呢,这个两个属性实际在使用中是有一些问题的,具体的,这里就不讲了,可以查阅相关资料.这里分享一个 ...
- js判断数据类型常用的6种方法
js判断数据类型常用的方法,不论在开发中开始在面试中,都是经常遇到的问题,尤其是在面试时,当面试官问及js判断数据类型的方法时,回答的越多,说明掌握的广度跟深度越多,感觉自己逼格也越高.废话不多说了, ...
- 9种数据类型,数据类型区别及判断数据类型方法
基本数据类型: String,Number,null,undefined,Boolean (通常所说的五种原始数据类型),Symbol,BigInt (ES6新增) 引用类型: object [基 ...
- js中判断数据类型的方法
JS中判断数据类型的方法: 使用typeof操作符. 对一个值使用 typeof 操作符可能返回下列某个字符串,返回的类型都是字符串形式. (1) undefined:如果这个值未定义 (2) boo ...
- python判断数据类型是不是字典的方法
这篇文章主要介绍python判断数据类型是不是字典的方法,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完! python的数据类型有:数字(int).浮点(float).字符串(s ...
- python判断数据_python判断数据类型的方法
python判断数据类型的方法 发布时间:2020-08-19 15:23:59 来源:亿速云 阅读:96 作者:小新 小编给大家分享一下python判断数据类型的方法,相信大部分人都还不怎么了解,因 ...
- JS判断数据类型以及数据过滤空值方法
JS判断数据类型以及数据过滤空值方法 在我们的项目开发中,经常需要对一个传输中的数据进行滤空处理,过滤 null.undefined.''.[].{}等,还要对字符串进行去除两端的空格操作.为此,我写 ...
- js 判断数据类型的四种方法
1,typeof typeof 返回的数据类型有 undefined boolean (true,false) string symbol number function object 注意 typ ...
最新文章
- 超越EfficientNet,GPU上加速5倍,何恺明组CVPR 2020论文提出新型网络设计范式
- 使用etcd+confd管理nginx配置
- php获取ios或android通过文件头(header)传过来的坐标,通过百度接口获取具体城市和地址,并存入到session中...
- dedecms arclist中截取字符串的方法
- 启明云端方案分享| ESP32-S2 摄像头 WIFI方案应用于智能猫眼
- [公告]博客园恢复正常运行
- shell 数组操作
- java分页数据导出excel
- html5文本超过指定行数隐藏显示省略号
- js中if表达式判断规则
- Vue 自定义指令上报 Google Analytics 事件统计
- 用java实现页面搜索功能_关于如何利用矩阵实现搜索功能
- github fork自己的库,如何同步源库的更新
- windows idea Tomcat端口被占用
- 常用圆圈数字序号(1~50)
- Windows API函数大全(Windows编程参考手册)
- 计算机绘图第二章,机械制图电子教桉-02第二章+计算机绘图..ppt
- 【tensorrt】——error: #error The version of CUB in your include path is not compatible with this releas
- 如何使生成的exe程序默认以管理员权限启动
- python里面else什么意思_python中if else和if elif else有什么区别?