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 相关文章推荐
jQuery 选择器理解
Mar 16 Javascript
原生javascript实现获取指定元素下所有后代元素的方法
Oct 28 Javascript
JQuery判断checkbox是否选中及其它复选框操作方法合集
Jun 01 Javascript
深入浅析JSON.parse()、JSON.stringify()和eval()的作用详解
Apr 03 Javascript
改变checkbox默认选中状态及取值的实现代码
May 26 Javascript
Bootstrap编写导航栏和登陆框
May 30 Javascript
JS实现兼容火狐及IE iframe onload属性的遮罩层隐藏及显示效果
Aug 23 Javascript
js实现文字向上轮播功能
Jan 13 Javascript
JS设置随机出现2个数字的实例代码
Jul 19 Javascript
微信小程序之页面跳转和参数传递的实现
Sep 29 Javascript
vue :src 文件路径错误问题的解决方法
May 15 Javascript
three.js利用射线Raycaster进行碰撞检测
Mar 12 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
PHP动态输出JavaScript代码实例
2015/02/12 PHP
PHP发送AT指令实例代码
2016/05/26 PHP
PHP 实现字符串翻转(包含中文汉字)的实现代码
2017/04/01 PHP
PHP实现根据数组的值进行分组的方法
2017/04/20 PHP
详解PHP版本兼容之openssl调用参数
2018/07/25 PHP
Laravel中为什么不使用blpop取队列详析
2018/08/01 PHP
PHP中rename()函数的妙用讲解
2019/02/28 PHP
jquery checkbox全选、取消全选实现代码
2010/03/05 Javascript
一个简单的jQuery插件制作 学习过程及实例
2010/04/25 Javascript
jquery插件制作 表单验证实现代码
2012/08/17 Javascript
js substring从右边获取指定长度字符串(示例代码)
2013/12/23 Javascript
无刷新上传文件并返回自定义值
2015/06/11 Javascript
AngularJS中$interval的用法详解
2016/02/02 Javascript
再次谈论Javascript中的this
2016/06/23 Javascript
PHP获取当前页面完整URL的方法
2016/12/02 Javascript
深入理解javascript中concat方法
2016/12/12 Javascript
js动态添加表格逐行添加、删除、遍历取值的实例代码
2018/01/25 Javascript
AngularJS日期格式化常见操作实例分析
2018/05/17 Javascript
vue实现组件之间传值功能示例
2018/07/13 Javascript
优雅的elementUI table单元格可编辑实现方法详解
2018/12/23 Javascript
jQuery实现视频展示效果
2020/05/30 jQuery
python发布模块的步骤分享
2014/02/21 Python
ubuntu系统下 python链接mysql数据库的方法
2017/01/09 Python
Python引用类型和值类型的区别与使用解析
2017/10/17 Python
python抓取网页中链接的静态图片
2018/01/29 Python
详解Python判定IP地址合法性的三种方法
2018/03/06 Python
Python3爬虫使用Fidder实现APP爬取示例
2018/11/27 Python
pandas和spark dataframe互相转换实例详解
2020/02/18 Python
浅谈pandas dataframe对除数是零的处理
2020/07/20 Python
python 使用tkinter+you-get实现视频下载器
2020/11/17 Python
python安装及变量名介绍详解
2020/12/12 Python
html5 viewport使用方法示例详解
2013/12/02 HTML / CSS
复古服装:RetroStage
2019/05/10 全球购物
世界汽车零件:World Car Parts
2019/09/04 全球购物
Belvilla法国:休闲度假房屋出租
2020/10/03 全球购物
2014年幼儿园学期工作总结
2014/12/05 职场文书