jQuery学习笔记之jQuery.extend(),jQuery.fn.extend()分析


Posted in Javascript onJune 09, 2014

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();

jQuery学习笔记之jQuery.extend(),jQuery.fn.extend()分析

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

jQuery学习笔记之jQuery.extend(),jQuery.fn.extend()分析

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

jQuery学习笔记之jQuery.extend(),jQuery.fn.extend()分析

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减一.从而使传入的对象当作源对象.

jQuery学习笔记之jQuery.extend(),jQuery.fn.extend()分析

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,则直接覆盖目标对象的同名属性.

Javascript 相关文章推荐
javascript 动态数据下的锚点错位问题解决方法
Dec 24 Javascript
深入理解JavaScript系列(3) 全面解析Module模式
Jan 15 Javascript
JS下拉缓冲菜单示例代码
Aug 30 Javascript
jquery实现div阴影效果示例代码
Sep 16 Javascript
把文本中的URL地址转换为可点击链接的JavaScript、PHP自定义函数
Jul 29 Javascript
JavaScript动态添加style节点的方法
Jun 09 Javascript
高性能JavaScript循环语句和条件语句
Jan 20 Javascript
jQuery实现页面点击后退弹出提示框的方法
Aug 24 Javascript
JS扩展类,克隆对象与混合类实例分析
Nov 26 Javascript
JS实现数组去重复值的方法示例
Feb 18 Javascript
angular4强制刷新视图的方法
Oct 09 Javascript
jQuery实现获取多选框的值示例
Feb 07 jQuery
js利用prototype调用Array的slice方法示例
Jun 09 #Javascript
jQuery学习笔记之jQuery.fn.init()的参数分析
Jun 09 #Javascript
用box固定长宽实现图片自动轮播js代码
Jun 09 #Javascript
jQuery实现的Div窗口震动特效
Jun 09 #Javascript
js动态创建标签示例代码
Jun 09 #Javascript
jquery中 $.expr使用实例介绍
Jun 09 #Javascript
jQuery select表单提交省市区城市三级联动核心代码
Jun 09 #Javascript
You might like
《魔兽争霸3:重制版》翻车了?你想要的我们都没有
2019/11/07 魔兽争霸
《PHP边学边教》(02.Apache+PHP环境配置――下篇)
2006/12/13 PHP
探讨php中防止SQL注入最好的方法是什么
2013/06/10 PHP
Prototype Selector对象学习
2009/07/23 Javascript
jquery 可排列的表实现代码
2009/11/13 Javascript
jquery获取被勾选的checked(选中)的那一行的3列和4列的值
2013/07/04 Javascript
jquery退出each循环的写法
2014/02/26 Javascript
开源的javascript项目Kissy介绍
2014/11/28 Javascript
Javascript中实现trim()函数的两种方法
2015/02/04 Javascript
js实现仿百度汽车频道选择汽车图片展示实例
2015/05/06 Javascript
JavaScript中的cacheStorage使用详解
2015/07/29 Javascript
jquery实现页面虚拟键盘特效
2015/08/08 Javascript
使用jQuery制作基础的Web图片轮播效果
2016/04/22 Javascript
浅谈在koa2中实现页面渲染的全局数据
2017/10/09 Javascript
vue 实现复制内容到粘贴板clipboard的方法
2018/03/17 Javascript
Layui多选只有最后一个值的解决方法
2019/09/02 Javascript
echarts实现获取datazoom的起始值(包括x轴和y轴)
2020/07/20 Javascript
[36:37]2014 DOTA2华西杯精英邀请赛5 24 VG VS iG
2014/05/25 DOTA
[02:34]2016完美“圣”典风云人物:BurNIng专访
2016/12/10 DOTA
Python时间戳与时间字符串互相转换实例代码
2013/11/28 Python
python显示天气预报
2014/03/02 Python
python实现的解析crontab配置文件代码
2014/06/30 Python
python实现去除下载电影和电视剧文件名中的多余字符的方法
2014/09/23 Python
详解Python中的join()函数的用法
2015/04/07 Python
Python实现配置文件备份的方法
2015/07/30 Python
python树莓派红外反射传感器
2019/01/21 Python
基于python实现百度翻译功能
2019/05/09 Python
深入了解Django中间件及其方法
2019/07/26 Python
面向对象学习之pygame坦克大战
2019/09/11 Python
python实现双色球随机选号
2020/01/01 Python
Django 博客实现简单的全文搜索的示例代码
2020/02/17 Python
python可以用哪些数据库
2020/06/22 Python
澳大利亚网上书店:QBD
2021/01/09 全球购物
运动会表扬稿
2015/01/16 职场文书
会议新闻稿
2015/07/17 职场文书
2016年大学生暑期社会实践活动总结
2016/04/06 职场文书