bing0117

2、jQuery的一些静态方法

 

 

 

上次粗略说了jQuery的整体结构,这次挑一些静态方法先说一下吧

一、noConflict函数

这个函数是个比较有意思的函数,基本上很少用到,之所以说他是因为这个函数在最下面,太显眼了,先把他解决掉。

noConflict函数是jQuery用来解决$符号和jQuery版本冲突的。如下:

 1 var
 2 
 3     // Map over jQuery in case of overwrite
 4     _jQuery = window.jQuery,
 5 
 6     // Map over the $ in case of overwrite
 7     _$ = window.$;
 8 
 9 jQuery.noConflict = function( deep ) {
10     if ( window.$ === jQuery ) {
11         window.$ = _$;
12     }
13 
14     if ( deep && window.jQuery === jQuery ) {
15         window.jQuery = _jQuery;
16     }
17 
18     return jQuery;
19 };

可以看出jQuery团队考虑了很多,在初始化的时候就提前讲全局变量中的jQuery和$保存了起来,然后如果后期在调用了这个函数之后就可以将$符号的使用权让出来,甚至如果你传入了一个为true的值之后还可以将jQuery这个关键字来让出来。转让$的使用权是因为老美偏爱这个符号,很多成熟的框架都在使用了这个符号如果共同使用可能会产生冲突。而转让jQuery权限是为了防止版本冲突,例如你之前使用了低版本的jQuery,但是又想在项目中使用高版本的jQuery方法,那么你可以使用newJQuery = jQuery.noConflict( true ); 来实现,后续使用高版本的jQuery库只需要newJQuery.function()即可。

二、函数体内的扩展方法和字段

jQuery函数体内在开始定义了一下方法的别名,这个好处一个就是后续使用这些方法不需要再使用一大长串字符来使用这个方法了,只需要使用简短的别名就可以。后面的源码中大量使用了这些别名,下面先从jQuery定义的一些扩展方法开始说明。

先来看expando属性,这个属性是jQuery中的唯一值,使用jQuery+版本号+随机字符串,然后把后面部分的所有非数字全都去掉,也就是这个字段会变成一个jQuery+一长串数字。这个唯一字段跟数据缓存和事件机制都有关系。

然后isReady是否jQuery加载好,error这个是抛出错误信息,noop是定义一个空函数,比如当插件提供了一个可选的回调函数接口,那么如果调用的时候没有传递这个回调函数,就用$.noop来代替执行,这几个没什么好说的。

isFunction这个函数,这个函数其实本身没什么好说的,但是它里面用到了一个有意思的函数type,这个type是jQuery自定义的一个函数,用来区分数据类型的,类似于typeof,但是比typeof强大好用的多,不用再担心typeof null会给你一个object这种尴尬的事情了。

提到js中判断数据类型的方法,用的最多的就是typeof和instanceof,但是常规的这种方法都有其局现性,无法做到精确判断所有的数据类型,其实最精确的数据判断方法是使用:

Object.prototype.toString.call(String) ==> [object String]

这种方法,但是这种方法本身很繁琐,而且给出的结果也是一大串,于是jQuery扩展了这个方法,$.type方法中一开始判断传参是否==null,这个地方是用来判断obj是否是null或者undefined类型,所有数据类型中只有null和undefined是能够==的,因此如果是这两种类型的话就可以直接返回这个类型的字符串。

type函数后面判断obj如果不是object类型或者function类型的话就直接返回typeof的值,如果是的话会返回一个class2type[toString.call(obj)],这个前面说过了,预先定义了一个class2typt的对象,jQuery的extend函数后面有一个这个

这个是将所有的用typeof判断不了的类型预先定义出来,然后根据Object.prototype.toString.call()来判断准确的数据类型,然后将这些字段作为参数名给class2type赋值小写的名称,所以$.type不管是任何数据类型都能够准确的返回该类型小写的值。

isWindow是判断参数是否是一个浏览器窗口,只有window对象才有window属性。

isNumeric: function( obj ) {
        var type = jQuery.type( obj );
        return ( type === "number" || type === "string" ) &&
            !isNaN( obj - parseFloat( obj ) );
    },

isNumeric函数是来判断参数是否为数字类型的,这里用到了前面说的type()方法,你可能会疑问,既然type方法这么好用为什么还要多此一举的弄个这个方法呢?因为jQuery想将数字判断做的更加完善,type()方法只能判断123这种纯数字的类型,类似"123"这种字符串的数字就会返回string类型,jQuery用了这种方法就可以将字符串数字也判断出来。parseFloat函数可以将obj解析成浮点型数字或者NaN,然后判断计算结果是否为NaN,通过这种结合巧妙地将问题解决了。

isEmptyObject: function( obj ) {
        var name;
        for ( name in obj ) {
            return false;
        }
        return true;
    },

isEmptyObject就是判断传参是否为空对象,只要有可枚举的属性值就判断为非空,返回false。

发表于 2018-02-05 21:06 刘冰0117 阅读(...) 评论(...) 编辑 收藏
 

相关文章: