isArray()函数(JavaScript中对象类型判断的几种方法)


Posted in Javascript onNovember 26, 2009

1) typeof 运算符
typeof 是一元运算符,返回结果是一个说明运算数类型的字符串。如:"number","string","boolean","object","function","undefined"(可用于判断变量是否存在)。
但 typeof 的能力有限,其对于Date、RegExp类型返回的都是"object"。如:

typeof {}; // "object"
typeof []; // "object"
typeof new Date(); // "object"

所以它只在区别对象和原始类型的时候才有用。要区一种对象类型和另一种对象类型,必须使用其他的方法。如:instanceof 运算符或对象的 constructor 属。

2)instanceof 运算符。
instanceof 运算符要求其左边的运算数是一个对象,右边的运算数是对象类的名字或构造函数。如果 object 是 class 或构造函数的实例,则 instanceof 运算符返回 true。如果 object 不是指定类或函数的实例,或者 object 为 null,则返回 false。如:

[] instanceof Array; // true
[] instanceof Object; // true
[] instanceof RegExp; // false
new Date instanceof Date; // true

所以,可以用instanceof运算符来判断对象是否为数组类型:

function isArray(arr)
{
return arr instanceof Array;
}

3)constructor 属性。
JavaScript中,每个对象都有一个constructor属性,它引用了初始化该对象的构造函数,常用于判断未知对象的类型。如给定一个求知的值通过typeof运算符来判断它是原始的值还是对象。如果是对象,就可以使用constructor属性来判断其类型。所以判断数组的函数也可以这样写:

function isArray(arr)
{
return typeof arr == "object" && arr.constructor == Array;
}

很多情况下,我们可以使用instanceof运算符或对象的constructor属性来检测对象是否为数组。例如很多JavaScript框架就是使用这两种方法来判断对象是否为数组类型。
但是检测在跨框架(cross-frame)页面中的数组时,会失败。原因就是在不同框架(iframe)中创建的数组不会相互共享其prototype属性。例如:

<script> 
window.onload=function(){ 
var iframe_arr=new window.frames[0].Array; 
alert(iframe_arr instanceof Array); // false 
alert(iframe_arr.constructor == Array); // false 
} 
</script> <body> 
<iframe></iframe> 
</body>

在Ajaxian上看到了一种精确的检测方法,跨原型链调用toString()方法:Object.prototype.toString()。可以解决上面的跨框架问题。

当Object.prototype.toString(o)执行后,会执行以下步骤:
1)获取对象o的class属性。
2)连接字符串:"[object "+结果(1)+"]"
3)返回 结果(2)

例如:

Object.prototype.toString.call([]); // 返回 "[object Array]"
Object.prototype.toString.call(/reg/ig); // 返回 "[object RegExp]"

这样,我们就可以写一个健壮的判断对象是否为数组的函数:

function isArray(arr) 
{ 
return Object.prototype.toString.call(arr) === "[object Array]"; 
}

此种方法得到国外多个javaScript大师的认可,在即将发布的jQuery 1.3中将使用这种方法来检测数组。

prototype.js的一个维护者写了下面这个函数,用于获取对象的类型名

function __getClass(object)
{
return Object.prototype.toString.call(object).match(/^\[object\s(.*)\]$/)[1];
};

扩展一下,用于检测各种对象类型:

var is = 
{ 
types : ["Array", "Boolean", "Date", "Number", "Object", "RegExp", "String", "Window", "HTMLDocument"] 
} for(var i = 0, c; c = is.types[i ++ ]; ) 
{ 
is[c] = (function(type) 
{ 
return function(obj) 
{ 
return Object.prototype.toString.call(obj) == "[object " + type + "]"; 
} 
} 
)(c); 
} 
alert(is.Array([])); // true 
alert(is.Date(new Date)); // true 
alert(is.RegExp(/reg/ig)); // true
Javascript 相关文章推荐
Javascript跨域请求的4种解决方式
Mar 17 Javascript
Jquery 获取指定标签的对象及属性的设置与移除
May 29 Javascript
自己封装的javascript事件队列函数版
Jun 12 Javascript
javascript判断css3动画结束 css3动画结束的回调函数
Mar 10 Javascript
JavaScript截断字符串的方法
Jul 15 Javascript
JavaScript通过使用onerror设置默认图像显示代替alt
Mar 01 Javascript
JavaScript数据操作_浅谈原始值和引用值的操作本质
Aug 23 Javascript
vue2.0移除或更改的一些东西(移除index key)
Aug 28 Javascript
js使用html2canvas实现屏幕截取的示例代码
Aug 28 Javascript
67 个节约开发时间的前端开发者的工具、库和资源
Sep 12 Javascript
如何使用Node.js爬取任意网页资源并输出PDF文件到本地
Jun 17 Javascript
no-vnc和node.js实现web远程桌面的完整步骤
Aug 11 Javascript
Exitjs获取DataView中图片文件名
Nov 26 #Javascript
网页中的图片的处理方法与代码
Nov 26 #Javascript
js 动态选中下拉框
Nov 26 #Javascript
js 对联广告、漂浮广告封装类(IE,FF,Opera,Safari,Chrome
Nov 26 #Javascript
JS在IE和FF下attachEvent,addEventListener学习笔记
Nov 26 #Javascript
JS小框架 fly javascript framework
Nov 26 #Javascript
jquery.ui.progressbar 中文文档
Nov 26 #Javascript
You might like
动态生成gif格式的图像要注意?
2006/10/09 PHP
php全排列递归算法代码
2012/10/09 PHP
laravel容器延迟加载以及auth扩展详解
2015/03/02 PHP
Yii框架中sphinx索引配置方法解析
2016/10/18 PHP
php中通用的excel导出方法实例
2017/12/30 PHP
PHP异常类及异常处理操作实例详解
2018/12/19 PHP
JQuery扩展插件Validate 5添加自定义验证方法
2011/09/05 Javascript
js变量以及其作用域详解
2020/07/18 Javascript
javascript 二进制运算技巧解析
2012/11/27 Javascript
jQuery中parents()方法用法实例
2015/01/07 Javascript
学习javascript文件加载优化
2016/02/19 Javascript
JavaScript实现字符串与日期的互相转换及日期的格式化
2016/03/07 Javascript
AngularJS bootstrap启动详解及实例代码
2016/09/14 Javascript
微信小程序之拖拽排序(代码分享)
2017/01/21 Javascript
jQuery实现广告条滚动效果
2017/08/22 jQuery
初识 Vue.js 中的 *.Vue文件
2017/11/22 Javascript
VUE2 前端实现 静态二级省市联动选择select的示例
2018/02/09 Javascript
Vux+Axios拦截器增加loading的问题及实现方法
2018/11/08 Javascript
微信小程序 checkbox使用实例解析
2019/09/09 Javascript
细说webpack6 Babel的使用详解
2019/09/26 Javascript
js实现内置计时器
2019/12/16 Javascript
jQuery实现鼠标放置名字上显示详细内容气泡提示框效果的方法分析
2020/04/04 jQuery
OpenLayers3实现对地图的基本操作
2020/09/28 Javascript
[04:22]DOTA2大事件之护国神翼
2020/08/14 DOTA
python fabric使用笔记
2015/05/09 Python
Django跨域请求CSRF的方法示例
2018/11/11 Python
基于python判断目录或者文件代码实例
2019/11/29 Python
Python爬虫库requests获取响应内容、响应状态码、响应头
2020/01/25 Python
python发qq消息轰炸虐狗好友思路详解(完整代码)
2020/02/15 Python
详解CSS3中@media的实际使用
2015/08/04 HTML / CSS
HTML5如何为形状图上颜色怎么绘制具有颜色和透明度的矩形
2014/06/23 HTML / CSS
Lancer Skincare官方网站:抗衰老皮肤护理
2020/11/20 全球购物
课程设计的心得体会
2014/09/03 职场文书
带香烟到学校抽的检讨书
2014/09/25 职场文书
Python 发送SMTP邮件的简单教程
2021/06/24 Python
golang为什么要统一错误处理
2022/04/03 Golang