Javascript教程:判断函数类型

2016-02-20 00:58 5 1 收藏

想不想get新技能酷炫一下,今天图老师小编就跟大家分享个简单的Javascript教程:判断函数类型教程,一起来看看吧!超容易上手~

【 tulaoshi.com - Web开发 】

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

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

在判断函数类型时,我们通常使用typeof方法,一般情况下,它会得到我们所预想的效果。但是,有一些细节并不为我们所熟知。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

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

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

来源:http://www.tulaoshi.com/n/20160220/1632936.html

延伸阅读
标签: Web开发
JavaScript脚本语言同其它语言一样,有它自身的基本数据类型、表达式和算术运算符以及程序的基本框架结构。JavaScript提供了四种基本的数据类型用来处理数字和文字, 而变量提供存放信息的地方, 表达式则可以完成较复杂的信息处理。 1、基本数据类型 在JavaScript中四种基本的数据类型:数值(整数和实数)、字符串型(用号或‘&...
标签: PHP
    在C/C++中,头文件ctype.h中定义了关于字符类型一组宏,可以得到给定字符的类型。 而PHP中没有相关函数。前些天发现在www.mm4.de下载的PHP中提供了一个名为php_ctype.dll的扩展库, 加载后发现提供一部分此类的函数,特整理出来供大家参考。   在PHP中正确加载php_ctype.dll文件后,用<?php phpinfo();?可...
标签: Web开发
JavaScript中small函数方法是将 HTML 的SMALL 标识添加到String 对象中的文本两端。使用方法: strVariable.small( )"String Literal".small( ) 下面的示例演示了 JavaScript中small函数方法是如何使用的: var strVariable = "This is a string";strVariable = strVariable.small( ); 在上一条语句...
标签: Web开发
在JavaScript中我们需要用到trim的地方很多,但是JavaScript又没有独立的trim函数或者方法可以使用,所以我们需要自己写个trim函数来实现我们的目的。      方案一:      以原型方式调用,即obj.trim()形式,此方式简单且使用方面广泛,定义方式如下: script language=”javascript” /** * 删除...
标签: Web开发
    Eval()函数 这是我在学习找到的一篇简述Eval的文章,我在此转贴并加入一点自己的心得!在此谢谢原创者 该函数可以把一个字符串当作一个JavaScript表达式一样去执行它,具体来说,就是eval接受一个字符串类型的参数,将这个字符串作为代码在上下文环境中执行,并返回执行的结果。举个小例子:  var the_unevaled_answe...

经验教程

259

收藏

23

精华推荐

javascript函数库

javascript函数库

祖传秘方great

javascript ajax功能函数

javascript ajax功能函数

fdgsdf2323

JavaScript 判断来源网址

JavaScript 判断来源网址

金点影视工作室

微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部