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 ...
随机推荐
- hdu 5652 India and China Origins(二分+bfs || 并查集)BestCoder Round #77 (div.2)
题意: 给一个n*m的矩阵作为地图,0为通路,1为阻碍.只能向上下左右四个方向走.每一年会在一个通路上长出一个阻碍,求第几年最上面一行与最下面一行会被隔开. 输入: 首行一个整数t,表示共有t组数据. ...
- .net中实现RSS方法
引用 如何在.net动态网站中实现RSS呢?主要思想是编写一个能够自动按照RSS格式生成xml文档的通用类.具体步骤如下: 步骤一:创建RSS通用类 C#代码 using System; usin ...
- 任务调度框架FluentScheduler简介
之前我在文章中介绍过.net中的任务调度框架Hangfire,HangFire虽然本身输入比较简单好用的,但是,如果我们的程序本身提供的服务不是任务调度,而任务调度只是里面并不重要的小功能的时候,用H ...
- 0xWS2812 STM32 driver for WS2812(B) RGB LEDs
0xWS2812 STM32 driver for WS2812(B) RGB LEDs 0xWS2812 pronounced "hex-WS2812" This code ai ...
- systemtap 安装 总结
http://blog.soul11201.com/notes/2017/02/22/systemstap-install.html
- Unity3D实践系列02,查看Scene窗口物体
删除"Hierarchy"窗口中的"Directional Light". 把鼠标放在"Scene"窗口,滑动鼠标滚轮,可以对"S ...
- 使用C#的泛型队列Queue实现生产消费模式
本篇体验使用C#的泛型队列Queue<T>实现生产消费模式. 如果把生产消费想像成自动流水生产线的话,生产就是流水线的物料,消费就是某种设备对物料进行加工的行为,流水线就是队列. 现在,要 ...
- 淘宝接口 TopAPi
演示一下调用淘宝的接口,让大家心里有个数, 很简单,新建一个工程,拖一个IDHttp,Button和Memo到窗体上去 然后在这个Button的OnClick事件中写入如下代码: [delphi] v ...
- [erlang] mnesia
原文地址: http://www.cnblogs.com/bluefrog/archive/2012/05/16/2504625.html 本来是项目合作的,可是你却一而再再而三的使用这招,我处理愤怒 ...
- C#编程(六十一)------------LINQ中的扩展方法
原文链接: http://blog.csdn.net/shanyongxu/article/details/47208401 LINQ中的扩展方法 LINQ中where扩展方法,要想使用,必须导入us ...