Javascript 判断函数类型完美解决方案


Posted in Javascript onSeptember 02, 2009

但是,有一些细节并不为我们所熟知。John Resig 在分析了这些细节之后,为我们提供了一个完美的解决方案,本文将作详细介绍:

一、传统方法不为人所知的细节
毫无疑问,在判断函数类型时,我们使用的是typeof方法,比如:

function fn(){ 
//content 
} 
alert(typeof fn)//结果是"function"。

但是,该方法在一些浏览器中并不是像我们想像的那样工作。

1、Firefox2和Firefox3
在这两个浏览器中,用typeof检测HTML对象元素的类型,得到是一个不精确的“function”结果,而不是“object”,如HTMLDocument。如:

alert(typeof HTMLDocument); 
//在Firefox2中结果是"function"; 
//在Firefox3中结果是"object";

2、Firefox2
对于正则表达式,在该浏览器中返回的结果是“function”(在Firefox3中结果是“object”),如:
var reg = /test/; 
alert(typeof reg); 
//在Firefox2中结果是"function"; 
//在Firefox3中结果是"object";

注:本人在safari中测试,其结果也是“function”。
3、IE6和IE7
在IE中对DOM元素使用typeof方法,得到的结果是“object”。如:
alert(typeof document.getElementsByTagName("body")[0].getAttribute); 
//结果是"object"

4、Safari 3
safari认为DOM元素的NodeList是一个函数,如:
alert(typeof document.body.childNodes); 
//结果是"function"

很明显,如果你要测试一个对象是否为函数,使用typeof方法并不能从真正意义上保证测试结果。那么,我们就需要一种在所有浏览器中都能保证测试结果的解决方案。我们知道function本身有apply()和call()两种方法,但这两个方法在IE中存在问题的函数中并不存在,试试下面的测试:
alert(typeof document.getElementsByTagName("body")[0].getAttribute.call) 
//在IE中结果是"undefined"

显然,我们不能利用这两个方法。

二、完美解决方案及实现过程
John Resig为我们提供了一个完美的解决方案,这个复杂但很稳定的判断一个对象是否为函数的方法如下:

function isFunction( fn ) { 
return !!fn && !fn.nodeName && fn.constructor != String && 
fn.constructor != RegExp && fn.constructor != Array && 
/function/i.test( fn + "" ); 
}

这个函数首先保证测试的对象存在,并将其序列化成含有“function”的字符串,这个是我们检测的基础(fn.constructor != String,fn.constructor != Array, and fn.constructor != RegExp)。另外,我们需要保证声明的函数不是一个DOM节点(fn.nodeName)。然后,我们就可以作toString测试。如果我们将一个函数转换成字符串,在一个浏览器中(fn+"")给我们的结果就像这样“function name(){...}”。现在,判断它是否为函数就很简单,仅仅只需要判断字符串中是否包含单词“function”。这很神奇,对于任何有问题的函数,在所有浏览器中都能得到我们所需要的结果。这个函数较之于传统的方法,运行速度有些不尽人意,作者建议我们保守使用。

John Resig 是jQuery库的开发者,相信使用该库的朋友们对该库简洁的语法和优秀的性能并不陌生。作者除追求代码简洁和性能高效之外,其尽善尽美的精神也让人叹服。如果你是一个完美主义者,相信此文对你很有帮助。

Javascript 相关文章推荐
js下将阿拉伯数字每三位一逗号分隔(如:15000000转化为15,000,000)
Jun 02 Javascript
javascript中2个感叹号的用法实例详解
Sep 04 Javascript
基于jQuery Bar Indicator 插件实现进度条展示效果
Sep 30 Javascript
AngularJs中route的使用方法和配置
Feb 04 Javascript
js下将金额数字每三位一逗号分隔
Feb 19 Javascript
JS树形菜单组件Bootstrap TreeView使用方法详解
Dec 21 Javascript
jQuery中select与datalist制作下拉菜单时的区别浅析
Dec 30 Javascript
vue轮播图插件vue-concise-slider的使用
Mar 13 Javascript
linux 后台运行node服务指令方法
May 23 Javascript
通过实例学习React中事件节流防抖
Jun 17 Javascript
uni-app实现点赞评论功能
Nov 25 Javascript
pnpm对npm及yarn降维打击详解
Aug 05 Javascript
javascript 控制 html元素 显示/隐藏实现代码
Sep 01 #Javascript
jsTree树控件(基于jQuery, 超强悍)[推荐]
Sep 01 #Javascript
JavaScript 继承详解 第一篇
Aug 30 #Javascript
JavaScript 应用技巧集合[推荐]
Aug 30 #Javascript
用cssText批量修改样式
Aug 29 #Javascript
javascript appendChild,innerHTML,join性能比较代码
Aug 29 #Javascript
IE 条件注释详解总结(附实例代码)
Aug 29 #Javascript
You might like
如何使用动态共享对象的模式来安装PHP
2006/10/09 PHP
PHP大批量数据操作时临时调整内存与执行时间的方法
2011/04/20 PHP
如何使用PHP计算上一个月的今天
2013/05/23 PHP
Codeigniter上传图片出现“You did not select a file to upload”错误解决办法
2014/06/12 PHP
php中的观察者模式简单实例
2015/01/20 PHP
PHP自定义函数实现assign()数组分配到模板及extract()变量分配到模板功能示例
2018/05/23 PHP
验证用户是否修改过页面的数据的实现方法
2008/09/26 Javascript
js 模拟气泡屏保效果代码
2010/07/10 Javascript
jquery使用animate方法实现控制元素移动
2015/03/27 Javascript
js实现兼容性好的微软官网导航下拉菜单效果
2015/09/07 Javascript
vue音乐播放器插件vue-aplayer的配置及其使用实例详解
2017/07/10 Javascript
bootstrap table实现点击翻页功能 可记录上下页选中的行
2017/09/28 Javascript
Element Notification通知的实现示例
2020/07/27 Javascript
使用js和canvas实现时钟效果
2020/09/08 Javascript
OpenLayers3加载常用控件使用方法详解
2020/09/25 Javascript
vue 解决在微信内置浏览器中调用支付宝支付的情况
2020/11/09 Javascript
[00:55]深扒TI7聊天轮盘语音出处3
2017/05/11 DOTA
Python 实现选择排序的算法步骤
2018/04/22 Python
python TKinter获取文本框内容的方法
2018/10/11 Python
Python常用数据类型之间的转换总结
2019/09/06 Python
Python的几种主动结束程序方式
2019/11/22 Python
Python zip函数打包元素实例解析
2019/12/11 Python
pytorch dataloader 取batch_size时候出现bug的解决方式
2020/02/20 Python
python numpy实现多次循环读取文件 等间隔过滤数据示例
2020/03/14 Python
Python安装Bs4的多种方法
2020/11/28 Python
ROSEFIELD手表荷兰官方网上商店:北欧极简设计女士腕表品牌
2018/01/24 全球购物
Speedo速比涛德国官方网站:世界领先的泳装品牌
2019/08/26 全球购物
初中语文教学反思
2014/02/02 职场文书
企业文化建设实施方案
2014/03/22 职场文书
药品营销策划方案
2014/06/15 职场文书
乡镇安全生产目标责任书
2014/07/23 职场文书
群众路线领导班子四风对照检查材料
2014/09/27 职场文书
计算机考试作弊检讨书1000字
2015/01/01 职场文书
万能检讨书开头与结尾怎么写
2015/02/17 职场文书
Redis 持久化 RDB 与 AOF的执行过程
2021/11/07 Redis
python多线程方法详解
2022/01/18 Python