五.jQuery源码解析之jQuery.extend(),jQuery.fn.extend()
给jQuery做过扩展或者制作过jQuery插件的人这两个方法东西可能不陌生.
jQuery.extend([deep],target,object1,,object2...[objectN])
jQuery.fn.extend([deep],target,object1,,object2...[objectN])
这两个属性都是用于合并两个或多个对象的属性到target对象.
deep是布尔值,表示是否进行深度合并,默认是false,不执行深度合并.
通过这种方式可以在jQuery或jQuery.fn上添加新的属性和方法,jQuery的其他模块大都是这么实现的.
给jQuery添加扩展时用$.extend()
如:jQuery.extend({add:function(a,b){return a+b}})
使用:$.add(1,3)=====>4;
给jQuery实例对象添加扩展时用$.fn.extend();
$.fn.extend({gys:function(){$(this).css("color","red")}});
调用:$("div.guo").gys();

因为参数的个数是不确定的,所以没有列出可接受的具体参数.

options:指向某个源对象.
name:某个源对象的某个属性名.
src:目标对象的某个属性的原始值.
copy:某个源对象的某个属性的值
copyIsArray:指示copy是否是数组
clone:深度复制时原始值的修正值.
target:目标对象.
i:源对象的起始下标.
length:参数的个数,用于修正变量target.
deep:是否执行深度复制.

333~338:如果第一个参数是布尔值,则把target赋值给deep,target在重新获取值,把第二个参数赋给target.
这个时候i值从一开始的1变成了2.表示源对象本来是从第二个元素开始的,现在变成了第三个元素了.这段代码结合
327行代码就知道为什么会有这个if语句了.原来函数extend在执行的时候,不管参数情况如何,首先给target和i赋值.
然后再后面修正.
341~343:如果目标对象target不是对象,不是函数,则targeted={};
346~349:length和i相等时,表示没有传入objcet1,...之类的参数,
这个时候把this当前对象(jQuery或jQuery.fn)作为目标对象,在把i减一.从而使传入的对象当作源对象.

351行开始循环,i表示开始源对象的下标,是一个非常巧妙的用法.
353行也很精彩,它把获取源对象和对源对象的判断放在了一条语句中,只有源对象不为空时才会执行.
354~362行,变量src是原始值,变量copy是复制值.如果target和copy引用相同,为了遍历时死循环,
因此不会覆盖目标对象的同名属性.如果注释掉360行,下面的代码会出现异常.
var obj={};
obj.n1=obj;
$.extend(true,obj,{n2:obj});
在不同浏览器中会出项不同的报错,但是都无一例外的出现卡屏很久的现像.
365~372行,如果是深度合并,且复制copy是普通javascript对象或数组,则递归合并.
378~380行,如果不是深度合并,并且copy不是undefined,则直接覆盖目标对象的同名属性.
五.jQuery源码解析之jQuery.extend(),jQuery.fn.extend()的更多相关文章
- jQuery源码解析对象实例化与jQuery原型及整体构建模型分析(一)
//源码剖析都基于jQuery-2.0.3版本,主要考虑到兼容IE 一.关于jQuery对象实例化的逻辑: 整个jQuery程序被包裹在一个匿名自执行行数内: (function(window,und ...
- jQuery 源码解析二:jQuery.fn.extend=jQuery.extend 方法探究
终于动笔开始 jQuery 源码解析第二篇,写文章还真是有难度,要把自已懂的表述清楚,要让别人听懂真的不是一见易事. 在 jQuery 源码解析一:jQuery 类库整体架构设计解析 一文,大致描述了 ...
- jquery源码解析:代码结构分析
本系列是针对jquery2.0.3版本进行的讲解.此版本不支持IE8及以下版本. (function(){ (21, 94) 定义了一些变量和函数, jQuery = function() ...
- JQuery源码解析(一)
写在前面:本<JQuery源码解析>系列是基于一些前辈们的文章进行进一步的分析.细化.修改而写出来的,在这边感谢那些慷慨提供科普文档的技术大拿们. 要查阅JQ的源文件请下载开发版的JQ.j ...
- jquery源码学习笔记三:jQuery工厂剖析
jquery源码学习笔记二:jQuery工厂 jquery源码学习笔记一:总体结构 上两篇说过,query的核心是一个jQuery工厂.其代码如下 function( window, noGlobal ...
- jquery源码中noConflict(防止$和jQuery的命名冲突)的实现原理
jquery源码中noConflict(防止$和jQuery的命名冲突)的实现原理 最近在看jquery源码分析的视频教学,希望将视频中学到的知识用博客记录下来,更希望对有同样对jquery源码有困惑 ...
- 三.jQuery源码解析之jQuery的框架图
这张图片是对jQuery源码截图,一点一点拼出来的. 现在根据这张图片来对jQuery框架做一些说明. 一.16~9404行可以发现,最外层是一个自调用函数.当jQuery初始化时,这个自调用函数包含 ...
- jquery源码解析:jQuery数据缓存机制详解2
上一课主要讲了jQuery中的缓存机制Data构造方法的源码解析,这一课主要讲jQuery是如何利用Data对象实现有关缓存机制的静态方法和实例方法的.我们接下来,来看这几个静态方法和实例方法的源码解 ...
- jquery 源码解析
静态与实力方法共享设计 遍历方法 $(".a").each() //作为实例方法存在 $.each() //作为静态方法存在 Jquery源码 jQuery.prototype = ...
- jQuery 源码解析一:jQuery 类库整体架构设计解析
如果是做 web 的话,相信都要对 Dom 进行增删查改,那大家都或多或少接触到过 jQuery 类库,其最大特色就是强大的选择器,让开发者脱离原生 JS 一大堆 getElementById.get ...
随机推荐
- 安装 bochs-x
sudo apt-get install bochs-x
- Java回顾之JDBC
这篇文章里,我们来讨论一些和JDBC相关的话题. 概述 尽管在实际开发过程中,我们一般使用ORM框架来代替传统的JDBC,例如Hibernate或者iBatis,但JDBC是Java用来实现数据访问的 ...
- thinkphp3.2笔记(5)创建项目 创建模型 实例化
一 创建项目 1 拷贝框架 目录 public thinkphp .htaccess index.php [application不用拷贝,会自动生成] 2 public 下面创 ...
- Linux Mint 18.1安装nvidia驱动
硬件环境:Dell Inspiron 7557笔记本(i7,8G,GTX960M) 软件环境:Linux Mint 18.1(基于Ubuntu 16.04) 问题描述: Linux Mint 18.1 ...
- UVA-4288 Cat vs. Dog (最大独立集)
题目大意:猫狗大赛,s个猫和t个狗,有v个投票者,他们不是爱猫者就是爱狗者,所以爱猫者一定会对某条猫投晋级票,对某条狗投淘汰票,爱狗者亦然.现在已知这v个人的投票情况,应该使哪些畜牲晋级或淘汰才能使投 ...
- UVA-10603 Fill (BFS)
题目大意:有三个已知体积但不知刻度的杯子,前两个杯子中初始时没有水,第三个装满水,问是否可以倒出d升水,如果倒不出,则倒出一个最大的d’,使得d’<=d,并且在这个过程中要求总倒水量最少. 题目 ...
- Java中的HashMap的工作原理是什么?
问答题23 /120 Java中的HashMap的工作原理是什么? 参考答案 Java中的HashMap是以键值对(key-value)的形式存储元素的.HashMap需要一个hash函数,它使用ha ...
- window 更新 nodejs
一直号称js程序员,结果发现自己机器的node版本才到 4.x.赶紧升级下. 在window下可以直接去nodejs.org下载最新的稳定版装上就行.同时也可以通过 powershell 命令行更新. ...
- java定时器无法自动注入的问题解析(原来Spring定时器可以这样注入service)
近些日子在做一个项目,在项目中需要用到spring的定时任务,但是在操作数据库的时候发现总是不能正确的进行数据的插入,经过查看才发现:是因为service层不能够通过普通的方法注入到action,所以 ...
- SUSE Linux Enterprise Server设置IP地址、网关、DNS(转载)
说明: ip:192.168.21.172 子网掩码:255.255.255.0 网关:192.168.21.2 dns:8.8.8.8 8.8.4.4 1.设置ip地址vi /etc/sysco ...