判断JS的数据类型
typeof、instanceof、 constructor、 prototype方法比较
(摘自如何判断JS中的数据类型)
1. 使用typeof操作符。
对一个值使用 typeof 操作符可能返回下列某个字符串,返回的类型都是字符串形式。
(1) undefined:如果这个值未定义
(2) boolean:如果这个值是布尔值
(3) string:如果这个值是字符串
(4) number:如果这个值是数值
(5) object:如果这个值是对象或null
(6) function:如果这个值是函数
需要注意:typeof不适合用于判断是否为数组。当使用typeof判断数组和对象的时候,都会返回object。
可以使用isArray()来判断是否为数组。
2. instanceof
instanceof 运算符用来判断一个构造函数的prototype属性所指向的对象是否存在另外一个要检测对象的原型链上。需要区分大小写。
简单的来说,instanceof 用于判断一个变量是否某个对象的实例。
例:var arr = new Array( );
alert(arr instanceof Array); // 返回true
需要注意的是,instanceof只能用来判断对象和函数,不能用来判断字符串和数字等。判断它是否为字符串和数字时,只会返回false。
instanceof 是用来判断 A 是否为 B 的实例,表达式为:A instanceof B,如果 A 是 B 的实例,则返回 true,否则返回 false。 在这里需要特别注意的是:instanceof 检测的是原型,我们用一段伪代码来模拟其内部执行过程:
|
1
2
3
4
5
6
7
8
9
|
instanceof (A,B) = { var L = A.__proto__; var R = B.prototype; if(L === R) { // A的内部属性 __proto__ 指向 B 的原型对象 return true; } return false;} |
从上述过程可以看出,当 A 的 __proto__ 指向 B 的 prototype 时,就认为 A 就是 B 的实例,我们再来看几个例子:
|
1
2
3
4
5
6
7
8
9
10
|
[] instanceof Array;// true{} instanceof Object;// truenew Date() instanceof Date;// truefunction Person(){};new Person() instanceof Person;[] instanceof Object;// truenew Date() instanceof Object;// truenew Person instanceof Object;// true |
我们发现,虽然 instanceof 能够判断出 [ ] 是Array的实例,但它认为 [ ] 也是Object的实例,为什么呢?
我们来分析一下 [ ]、Array、Object 三者之间的关系:
从 instanceof 能够判断出 [ ].__proto__ 指向 Array.prototype,而 Array.prototype.__proto__ 又指向了Object.prototype,最终 Object.prototype.__proto__ 指向了null,标志着原型链的结束。因此,[]、Array、Object 就在内部形成了一条原型链:

从原型链可以看出,[] 的 __proto__ 直接指向Array.prototype,间接指向 Object.prototype,所以按照 instanceof 的判断规则,[] 就是Object的实例。依次类推,类似的 new Date()、new Person() 也会形成一条对应的原型链 。因此,instanceof 只能用来判断两个对象是否属于实例关系, 而不能判断一个对象实例具体属于哪种类型。
instanceof 操作符的问题在于,它假定只有一个全局执行环境。如果网页中包含多个框架,那实际上就存在两个以上不同的全局执行环境,从而存在两个以上不同版本的构造函数。如果你从一个框架向另一个框架传入一个数组,那么传入的数组与在第二个框架中原生创建的数组分别具有各自不同的构造函数。
|
1
2
3
4
5
|
var iframe = document.createElement('iframe');document.body.appendChild(iframe);xArray = window.frames[0].Array;var arr =new xArray(1,2,3);// [1,2,3]arr instanceof Array;// false |
针对数组的这个问题,ES5 提供了 Array.isArray() 方法 。该方法用以确认某个对象本身是否为 Array 类型,而不区分该对象在哪个环境中创建。
|
1
2
3
|
if (Array.isArray(value)){ //对数组执行某些操作} |
Array.isArray() 本质上检测的是对象的 [[Class]] 值,[[Class]] 是对象的一个内部属性,里面包含了对象的类型信息,其格式为 [object Xxx] ,Xxx 就是对应的具体类型 。对于数组而言,[[Class]] 的值就是 [object Array] 。
3. constructor
constructor 属性返回对创建此对象的数组函数的引用。
在JavaScript中,每个具有原型的对象都会自动获得constructor属性。
例:
以下代码中的[native code]
,表示这是JavaScript的底层内部代码实现,无法显示代码细节。

// String
var str = "字符串";
alert(str.constructor); // function String() { [native code] }
alert(str.constructor === String); // true // Array
var arr = [1, 2, 3];
alert(arr.constructor); // function Array() { [native code] }
alert(arr.constructor === Array); // true // Number
var num = 5;
alert(num.constructor); // function Number() { [native code] }
alert(num.constructor === Number); // true

4. prototype
以上三种方法多少都会有一些不能判断的情况。为了保证兼容性,可以通过Object.prototype.toString方法,判断某个对象值属于哪种内置类型。
需要注意区分大小写。
alert(Object.prototype.toString.call(“字符串”) === ‘[object String]’) -------> true;
alert(Object.prototype.toString.call(123) === ‘[object Number]’) -------> true;
alert(Object.prototype.toString.call([1,2,3]) === ‘[object Array]’) -------> true;
alert(Object.prototype.toString.call(new Date()) === ‘[object Date]’) -------> true;
alert(Object.prototype.toString.call(function a(){}) === ‘[object Function]’) -------> true;
alert(Object.prototype.toString.call({}) === ‘[object Object]’) -------> true;
判断JS的数据类型的更多相关文章
- 判断js中数据类型 的最短代码
判断字符串类型的: function isString(obj) { return obj+"" === obj; } 判断bool类型的: function isBool(obj ...
- 如何判断js中的数据类型?
js六大数据类型:number.string.object.Boolean.null.undefined string: 由单引号或双引号来说明,如"string" number: ...
- 如何判断js中的数据类型
如何判断js中的数据类型:typeof.instanceof. constructor. prototype方法比较 如何判断js中的类型呢,先举几个例子: var a = "iamstri ...
- [转]如何判断js中的数据类型
原文地址:http://blog.sina.com.cn/s/blog_51048da70101grz6.html 如何判断js中的数据类型:typeof.instanceof. constructo ...
- 如何判断js中的数据类型(转)
如何判断js中的数据类型:typeof.instanceof. constructor. prototype方法比较 如何判断js中的类型呢,先举几个例子: var a = "iamstri ...
- 判断js中的数据类型
如何判断js中的数据类型:typeof.instanceof. constructor. prototype方法比较 如何判断js中的类型呢,先举几个例子: var a = "iamstri ...
- Js中数据类型判断的几种方法
判断js中的数据类型有一下几种方法:typeof.instanceof. constructor. prototype. $.type()/jquery.type(),接下来主要比较一下这几种方法的异 ...
- 判断js中的数据类型的几种方法
判断js中的数据类型有一下几种方法:typeof.instanceof. constructor. prototype. $.type()/jquery.type(),接下来主要比较一下这几种方法的异 ...
- 转:判断js中的数据类型的几种方法
判断js中的数据类型有一下几种方法:typeof.instanceof. constructor. prototype. $.type()/jquery.type(),接下来主要比较一下这几种方法的异 ...
随机推荐
- 【转】python两个 list 获取交集,并集,差集的方法
1. 获取两个list 的交集: #方法一: a=[2,3,4,5] b=[2,5,8] tmp = [val for val in a if val in b] print tmp #[2, 5] ...
- 如何写一个makefile
最近因为编译需求,需要更改一些编译条件,顺带看了一些Makefile相关的知识,介绍的很详细,但是例子很少,拆分的比较零碎.初学的话,确实有点压力,我还是喜欢直接在原有的基础上改一些东西,然后遇到问题 ...
- Game Physics Cookbook (Gabor Szauer 著)
Chapter1: Vectors Chapter2: Matrices Chapter3: Matrix Transformations Chapter4: 2D Primitive Shapes ...
- python 连接 oracle 统计指定表格所有字段的缺失值数
python连接oracle -- qlalchemy import cx_Oracle as co import pandas as pd from sqlalchemy import crea ...
- Azure Redis Cache (5) Redis Cache Cluster集群模式
<Windows Azure Platform 系列文章目录> Redis Cluster 3.0之后的版本,已经支持Redis Cluster集群模式,Redis Cluster采用无中 ...
- msvcp140.dll丢失解决方案
[首先给出99%情况下都能解决这个问题的最简单办法]: 下载并安装微软VC++2015版运行库 (英文全称:Microsoft Visual C++ 2015 Redistributable Pa ...
- Ajax传递json数据简介和一个需要注意的小问题
Ajax传递json数据 Ajax操作与json数据格式在实际中的运用十分广泛,本文为大家介绍一个两者相结合的小案例: 项目结构 我们新建一个Django项目,在里面创建一个名为app01的应用: p ...
- css 实现多行文本末尾显示省略号
思路: 省略号使用绝对定位添加,开头部分避免突兀使用c3渐变背景颜色 <!DOCTYPE html> <html lang="en"> <head&g ...
- Git分支merge和rebase的区别
Git merge是用来合并两个分支的. git merge b # 将b分支合并到当前分支 同样 git rebase b,也是把 b分支合并到当前分支 原理 如下: 假设你现在基于远程分支&quo ...
- 2-zookeeper、ha
1.zookeeper ①背景: Zookeeper 最早起源于雅虎研究院的一个研究小组.在当时,研究人员发现,在雅虎内部很多大型系统基本都需要依赖一个类似的系统来进行分布式协调, 但是这些系统往往都 ...