jQuery中isFunction方法的BUG修复

jQuery 1.4 源码 449 行(core.js 431 行),判断是否为函数的方法如下(思路来源于 Douglas Crockford 的《The Miller Device》):

isFunction: function( obj ) {
    return toString.call(obj) === "[object Function]";
},

同时 jQuery 的作者也作了部分注释:

See test/unit/core.js for details concerning isFunction. Since version 1.3, DOM methods and functions like alert aren't supported. They return false on IE (#2968).

即:此方法在 IE 下无法正确识别 DOM 方法和一些函数(例如 alert 方法等)。

为什么会这样呢?

修复 jQuery 中 isFunction 方法的 BUG

使用 typeof 运算符检测各种方法:

document.writeln('typeof eval: ' + typeof eval + '
');
document.writeln('typeof confirm: ' + typeof confirm + '
');
document.writeln('typeof confirm: ' + typeof window.open + '
');
document.writeln('typeof alert: ' + typeof alert + '
');
document.writeln('typeof window.alert: ' + typeof window.alert + '
');
document.writeln('typeof document.getElementById: ' + typeof document.getElementById + '
');
document.writeln('typeof document.createElement: ' + typeof document.createElement + '
');

测试原始的 isFunction 函数方法

var isFunction = function( fn, name ) {
return document.writeln('isFunction(' + name + '): ' + (Object.prototype.toString.call(fn) === "[object Function]") + '
');

}

isFunction(eval,'eval');
isFunction(confirm, 'confirm');
isFunction(window.open, 'window.open');
isFunction(alert, 'alert');
isFunction(window.alert, 'window.alert');
isFunction(document.getElementById, 'document.getElementById');
isFunction(document.createElement, 'document.createElement');
isFunction(isFunction, 'isFunction');

测试修复后 isFunction 函数方法

var isFunction = (function() {
return typeof document.getElementById === "object" ?
isFunction = function(fn, name){
try {
return document.writeln('isFunction(' + name + '): ' + (/^\s*\bfunction\b/.test("" + fn)) + '
');
} catch (x) {
return document.writeln('isFunction(' + name + '): ' + (false) + '
');
}
}:
isFunction = function(fn, name){
return document.writeln('isFunction(' + name + '): ' + ("[object Function]" === Object.prototype.toString.call(fn)) + '
');
};
})()

isFunction(eval,'eval');
isFunction(confirm, 'confirm');
isFunction(window.open, 'window.open');
isFunction(alert, 'alert');
isFunction(window.alert, 'window.alert');
isFunction(document.getElementById, 'document.getElementById');
isFunction(document.createElement, 'document.createElement');
isFunction(isFunction, 'isFunction');

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

会发现在 IE 下用 typeof 检测 alert、confirm 方法以及 DOM 的方法显示 object,而其他浏览器下显示 function。

那如何完善这个问题呢?

  1. typeof 检测某个方法(例如:document.getElementById) 是否是 object,如何是,则重写 isFunction 函数;
  2. 怎样重写呢?正则判断传入的对象字符串后(”" + fn),是否起始位置含有 function,即:/^\s*\bfunction\b/.test(” + fn)。

OK,看下根据以上思路修改后的 isFunction 函数:


代码如下:

var isFunction = (function() { // Performance optimization: Lazy Function Definition return "object" === typeof document.getElementById ? isFunction = function(fn){ try { return /^\s*\bfunction\b/.test("" + fn); } catch (x) { return false } }: isFunction = function(fn){ return "[object Function]" === Object.prototype.toString.call(fn); };})()

参考阅读:


AKPC_IDS += "376,";

时间: 2010-01-23

js判断是否为数组的函数: isArray()

今天刚好在学习支付宝 JS 框架 base.js .瞄了一下,实现是这样的: 复制代码 代码如下: if (value instanceof Array || (!(value instanceof Object) && (Object.prototype.toString.call((value)) == '[object Array]') || typeof value.length == 'number' && typeof value.splice != 'unde

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

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

关于jQuery $.isNumeric vs. $.isNaN vs. isNaN

在jQuery中,有几种方式可以判断一个对象是否是数字,或者可否转换为数字.首先,jQuery.isNaN()在最新版本中已经被移除了(1.7之后),取而代之的是  jQuery.isNumeric ().这并不奇怪,因为jQuery.isNaN() 同Javascript内置的isNaN()名字相同,但是语义却不完全相同,在一定意义上会造成歧义. jQuery.isNumeric ()有着与其相似的功能,同时也解决了歧义问题. jQuery.isNumeric ()检查传进的参数是否是数字或者

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

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

代码分析jQuery四种静态方法使用

jQery每一个方法都有对应代码解析,非常详细,具有介绍请看下文: isFunction方法 用于测试是否为函数的对象 示例: function stub() { } var objs = [ function () {}, { x:15, y:20 }, null, stub, "function" ]; jQuery.each(objs, function (i) { var isFunc = jQuery.isFunction(objs[i]); $("span:eq(

jQuery四种选择器使用及示例

 jQuery 元素选择器 jQuery 使用 CSS 选择器来选取 HTML 元素. $("p") 选取 <p> 元素. $("p.intro") 选取所有 class="intro" 的 <p> 元素. $("p#demo") 选取所有 id="demo" 的 <p> 元素. 示例代码: jquery 部分 $(document).ready(function(){/

JS去除字符串最后的逗号实例分析【四种方法】

本文实例讲述了JS去除字符串最后的逗号.分享给大家供大家参考,具体如下: <script> window.onload=function() { var obj = {name: "xxx", age: 30, sex: "female"};//定义一个object对象 var str = ''//定义一个空字符用来接收对象里的key或者value for(var item in obj) {//遍历item变量里的对象的属性和元素, str += ob

php四种基础算法代码实例

php四种基础算法:冒泡,选择,插入和快速排序法许多人都说 算法是程序的核心,一个程序的好于差,关键是这个程序算法的优劣.作为一个初级phper,虽然很少接触到算法方面的东西 .但是对于冒泡排序,插入排序,选择排序,快速排序四种基本算法,我想还是要掌握的.下面是我按自己的理解,将四个方法分析一遍.需求:分别用 冒泡排序法,快速排序法,选择排序法,插入排序法将下面数组中 的值按照从小到的顺序进行排序. $arr(1,43,54,62,21,66,32,78,36,76,39); 1. 冒泡排序法

jQuery+CSS3实现四种应用广泛的导航条制作实例详解

导航条的使用很广,每个网站都会做出具有自己特色的导航条.最近特地去了解了各种类型的导航条,比如具有高亮显示的导航条,中英文互相切换的导航条,具有弹性动画的导航条,甚至是具有摩擦运动动画的导航条(文字下面有横线)等.每种导航条都有自己的特色,比如高亮显示的导航条看起来比较简单,但是视觉效果还不错,具有动画效果的导航条在视觉上也是有很好的效果. 接下来将会一一介绍4种应用比较广的导航条,即:高亮显示的导航条,中英文互相切换的导航条,具有弹性动画的导航条,具有摩擦运动动画的导航条. 1.高亮显示的导航

jQuery绑定事件的四种方式介绍

jQuery提供了多种绑定事件的方式,每种方式各有其特点,明白了它们之间的异同点,有助于我们在写代码的时候进行正确的选择,从而写出优雅而容易维护的代码.下面我们来看下jQuery中绑定事件的方式都有哪些. jQuery中提供了四种事件监听方式,分别是bind.live.delegate.on,对应的解除监听的函数分别是unbind.die.undelegate.off.在开始看他们之前 一:bind(type,[data],function(eventObject)) bind是使用频率较高的一

详解java中的四种代码块

在java中用{}括起来的称为代码块,代码块可分为以下四种: 一.简介 1.普通代码块: 类中方法的方法体 2.构造代码块: 构造块会在创建对象时被调用,每次创建时都会被调用,优先于类构造函数执行. 3.静态代码块: 用static{}包裹起来的代码片段,只会执行一次.静态代码块优先于构造块执行. 4.同步代码块: 使用synchronized(){}包裹起来的代码块,在多线程环境下,对共享数据的读写操作是需要互斥进行的,否则会导致数据的不一致性.同步代码块需要写在方法中. 二.静态代码块和构造

PHP四种排序算法实现及效率分析【冒泡排序,插入排序,选择排序和快速排序】

本文实例讲述了PHP四种排序算法实现及效率分析.分享给大家供大家参考,具体如下: PHP的四种基本排序算法为:冒泡排序.插入排序.选择排序和快速排序. 下面是我整理出来的算法代码: 1. 冒泡排序: 思路:对数组进行多轮冒泡,每一轮对数组中的元素两两比较,调整位置,冒出一个最大的数来. //简单版: function bubbleSort($arr) { $n = count($arr); for($i=1;$i<$n;$i++) { //冒泡的轮数(最多$n-1轮) for($j=0;$j<

ThinkPHP中RBAC类的四种用法分析

本文实例讲述了ThinkPHP中RBAC类的四种用法.分享给大家供大家参考.具体方法如下: 第一类:放在登陆控制器的登陆操作中 1.RBAC::authenticate(); 用于在用户表中查找表单提交的用户名的数据,实质上就是一条用户表查寻语句: 复制代码 代码如下: return M(modle)->where(array)->find(); 这个操作有两个参数 a.array()数组的写法及作用和表查寻数组一样: 复制代码 代码如下: array('字段'=>'值','字段'=&g

横向对比分析Python解析XML的四种方式

在最初学习PYTHON的时候,只知道有DOM和SAX两种解析方法,但是其效率都不够理想,由于需要处理的文件数量太大,这两种方式耗时太高无法接受. 在网络搜索后发现,目前应用比较广泛,且效率相对较高的ElementTree也是一个比较多人推荐的算法,于是拿这个算法来实测对比,ElementTree也包括两种实现,一个是普通ElementTree(ET),一个是ElementTree.iterparse(ET_iter). 本文将对DOM.SAX.ET.ET_iter四种方式进行横向对比,通过处理相