jQuery源码分析-构造函数详解
在jQuery.js的构造函数中,充分利用了JavsScript语言的动态性——对行参的类型和个数没有的严格要求,以至于一个函数可以实现多种功能需求,也为JavaScript语言的多态性提供了基础,在这个构造函数中,提供了六种不同的调用格式(根据官方API文档),具体如下($ = jQuery):
1、$(String expr):根据给定的CSS选择符查找匹配的元素,如$("div>p");
2、$(Element elem):将给定的DOM元素对象转换为jQuery对象,如$(document).find("div>p");
3、$(Array<Element> elems):如$(myForm.elements).hide();
4、$(Function fn):是$(document).ready()的简写模式,如:$( function fn(){ ... } );
5、$(jQuery obj):如:var div = $("div"); $(div).find("p");
6、$(String expr, Element context):在context中查找expr,如:$("div", xml.responseXML);
另外,jQuery中提到了Chainable Methods的思想,也就是调用jQuery中的方法会返回一个jQuery对象,仍然可以继续调用其中的方法,这样,就形成了一个“链条”,通过“.”一个一个调用下去,这个在构造函数中有具体体现,其中有如下一条语句:
if( window == this ) return new jQuery( a, c );
这个就是为了返回一个jQuery对象,在首次调用jQuery( a, c )函数时,this是等于window的,所以每次都会创建一个jQuery对象,更详细的代码分析见下:
// jQuery的构造函数;
var jQuery = function( a, c ) {
// $(document).ready()的简写形式,只有在$(function(){ })下才会执行;
if ( a && typeof a == "function" && jQuery.fn.ready ) return jQuery(document).ready(a);
// 确保参数a非空,默认值为document;
a = a || jQuery.context || document;
// 如果参数a是jQuery对象(a.jquery="1.0.3"),则克隆一个与a相同的jQuery对象;
if ( a.jquery ) return jQuery( jQuery.merge( a, [] ) );
// 从给定的参数c(要求c必须是jQuery对象)中查找a;
if ( c && c.jquery ) return jQuery( c ).find( a );
// 如果是初次调用$(),因为在window环境下,所以创建一个新的jQuery对象,如果去掉new则循环执行;
if ( window == this ) return new jQuery(a,c);
// 分析HTML串,如“div<ul>p”;
if ( a.constructor == String ) {
var m = /^[^<]*(<.+>)[^>]*$/.exec( a );
if ( m ) a = jQuery.clean( [ m[ 1 ] ] );
}
// 如果参数a是元素数组,则要执行jQery.merge(),否则要执行jQuery.find();
this.get( a.constructor == Array || a.length && !a.nodeType && a[0] != undefined && a[0].nodeType
? // 处理元素数组;
jQuery.merge( a, [] )
: // 查找相匹配的元素并保存;
jQuery.find( a, c ) );
// 如果附加了另外的函数,则在每个相匹配的jQuery对象上执行这个函数;
var fn = arguments[ arguments.length - 1 ];
if ( fn && typeof fn == "function" ) this.each( fn );
return this;
}; //jQuery的结束;
jQuery源码分析-构造函数详解的更多相关文章
- 【Java】HashMap源码分析——常用方法详解
上一篇介绍了HashMap的基本概念,这一篇着重介绍HasHMap中的一些常用方法:put()get()**resize()** 首先介绍resize()这个方法,在我看来这是HashMap中一个非常 ...
- JQuery 源码解析 · extend()详解
前言:最近想重写一个dropdown插件,于是想到了使用jquey实现插件,于是重温了一波$.extend()的知识,然后总结了这篇笔记 正文: $.extend(src) jQuery.exten ...
- jQuery 源码分析 8: 回头看jQuery的构造器(jQuery.fn,jQury.prototype,jQuery.fn.init.prototype的分析)
在第一篇jQuery源码分析中,简单分析了jQuery对象的构造过程,里面提到了jQuery.fn.jQuery.prototype.jQuery.fn.init.prototype的关系. 从代码中 ...
- jQuery源码分析系列
声明:本文为原创文章,如需转载,请注明来源并保留原文链接Aaron,谢谢! 版本截止到2013.8.24 jQuery官方发布最新的的2.0.3为准 附上每一章的源码注释分析 :https://git ...
- [转] jQuery源码分析-如何做jQuery源码分析
jQuery源码分析系列(持续更新) jQuery的源码有些晦涩难懂,本文分享一些我看源码的方法,每一个模块我基本按照这样的顺序去学习. 当我读到难度的书或者源码时,会和<如何阅读一本书> ...
- [转]jQuery源码分析系列
文章转自:jQuery源码分析系列-Aaron 版本截止到2013.8.24 jQuery官方发布最新的的2.0.3为准 附上每一章的源码注释分析 :https://github.com/JsAaro ...
- Android源码下载方法详解
转自:http://www.cnblogs.com/anakin/archive/2011/12/20/2295276.html Android源码下载方法详解 相信很多下载过内核的人都对这个很熟悉 ...
- jquery源码分析之一前言篇
1.问:jquery源码分析的版本是什么? 答:v3.2.1 2.问:为什么要分析jquery源码? 答:javascript是一切js框架的基础,jquery.es6.vue.angular.rea ...
- jQuery源码分析-each函数
本文部分截取自且行且思 jQuery.each方法用于遍历一个数组或对象,并对当前遍历的元素进行处理,在jQuery使用的频率非常大,下面就这个函数做了详细讲解: 复制代码代码 /*! * jQuer ...
随机推荐
- Redis 复制原理及分析
1.测试 见master-slave测试帖 2 原理 第一次.Slave向Master同步的实现是: Slave向Master发出同步请求(发送sync命令),Master先dump出rdb文件,然后 ...
- BZOJ2911 : [Poi1997]The Number of Symmetrical Choices
新建源汇S,T,根据题意可以建出一个DAG 设f[x][y]为从x走到y的回文路径的方案数,则 边界条件: f[x][x]=1 对于一条边x->y,若a[x]==a[y],则f[x][y]=1 ...
- OS X - 在80端口启动Nginx
不知道你是怎么在你的mac上安装nginx的,但是如果你跟我一样: brew install nginx 然后你会发现你的nginx.conf中的端口是8080. 于是你可能像我一样试着把端口改为80 ...
- centos7安装rvm
导入钥匙$ gpg --keyserver hkp://keys.gnupg.net --recv-keys 409B6B1796C275462A1703113804BB82D39DC0E3 若是提示 ...
- 【汇总】PHP-FPM 配置优化(转)
-----------------------开启php-fpm慢脚本日志 request_slowlog_timeout = 30sslowlog = /usr/local/php/var/log/ ...
- Redis "MISCONF Redis is configured to save RDB snapshots, but is currently not able to persist on disk"问题的解决(转)
今天第二次遇到Redis “MISCONF Redis is configured to save RDB snapshots, but is currently not able to persis ...
- Chrome中使用老的标题栏界面
Chrome 69中启用了新的UI界面,看着更加秀气了. 但新UI一个不好用的地方是标签栏太高了,留给windows标题栏的空白太小,导致拖动窗口位置非常不方便,如下是一个解决方法: 在地址栏输入: ...
- 荣耀 6 安装 SD 卡,提示:SD卡已安全移除
先前买了个 荣耀6(购买链接),自带存储只有 16G,用来一段时间后,老是提示存储不足.后来发现是 微信 等软件占用了好多存储(缓存),, 好吧,在京东上买了个 64G 扩展卡(购买链接),安装过程如 ...
- 《Go语言实战》摘录:6.3 并发 - 竞争状态
6.3 并发 - 竞争状态
- android音乐播放器开发 SweetMusicPlayer 摇一摇换歌
上一篇写了怎样在线匹配歌词,http://blog.csdn.net/huweigoodboy/article/details/39878063,如今来讲讲摇一摇功能开发. 相同用了一个Service ...