详解jQuery插件开发中的extend方法


Posted in Javascript onNovember 19, 2013

Jquery的扩展方法extend是我们在写插件的过程中常用的方法,该方法有一些重载原型,
dest是要整合的空间可以使{} 或者不写

src是一个JSON表达式表示的javascript对象.... 因此里面可以添加方法属性等等...

我么通过不同的应用可以将我们自己的方法整合到jQuery空间中....实现插件开发

在jQuery中定义  jQuery.extend = jQuery.fn.extend  所以这两个函数式相同的

 一、Jquery的扩展方法原型是: 

extend(dest,src1,src2,src3...);

它的含义是将src1,src2,src3...合并到dest中,返回值为合并后的dest,由此可以看出该方法合并后,是修改了dest的结构的。如果想要得到合并的结果却又不想修改dest的结构,可以如下使用:

var newSrc=$.extend({},src1,src2,src3...)//也就是将"{}"作为dest参数。

这样就可以将src1,src2,src3...进行合并,然后将合并结果返回给newSrc了。如下例:

var result=$.extend({},{name:"Tom",age:21},{name:"Jerry",sex:"Boy"})

那么合并后的结果

result={name:"Jerry",age:21,sex:"Boy"}

也就是说后面的参数如果和前面的参数存在相同的名称,那么后面的会覆盖前面的参数值。

二、省略dest参数
上述的extend方法原型中的dest参数是可以省略的,如果省略了,则该方法就只能有一个src参数,而且是将该src合并到调用extend方法的对象中去,如:
1、$.extend(src)
该方法就是将src合并到jquery的全局对象中去,如:

$.extend({   hello:function(){alert('hello');}   });

就是将hello方法合并到jquery的全局对象中。
2、$.fn.extend(src)
该方法将src合并到jquery的实例对象中去,如:
$.fn.extend({   hello:function(){alert('hello');}  });

就是将hello方法合并到jquery的实例对象中。

下面例举几个常用的扩展实例:

$.extend({net:{}});

这是在jquery全局对象中扩展一个net命名空间。

$.extend($.net,{    hello:function(){alert('hello');}   })

这是将hello方法扩展到之前扩展的Jquery的net命名空间中去。

三、Jquery的extend方法还有一个重载原型:

extend(boolean,dest,src1,src2,src3...)

第一个参数boolean代表是否进行深度拷贝,其余参数和前面介绍的一致,什么叫深层拷贝,我们看一个例子:

var result=$.extend( true,  {},       { name: "John", location: {city: "Boston",county:"USA"} },       { last: "Resig", location: {state: "MA",county:"China"} } );

我们可以看出src1中嵌套子对象location:{city:"Boston"},src2中也嵌套子对象location:{state:"MA"},第一个深度拷贝参数为true,那么合并后的结果就是:
 result={name:"John",last:"Resig",         location:{city:"Boston",state:"MA",county:"China"}}
 

也就是说它会将src中的嵌套子对象也进行合并,而如果第一个参数boolean为false,我们看看合并的结果是什么,如下:

var result=$.extend( false, {},   { name: "John", location:{city: "Boston",county:"USA"} },   { last: "Resig", location: {state: "MA",county:"China"} }                       );

那么合并后的结果就是:
result={name:"John",last:"Resig",location:{state:"MA",county:"China"}}

以上就是$.extend()在项目中经常会使用到的一些细节。

Javascript 相关文章推荐
jQuery1.6 正式版发布并提供下载
May 05 Javascript
使用jquery制作弹出框效果
Apr 03 Javascript
浅谈jQuery构造函数分析
May 11 Javascript
详细解读JavaScript编程中的Promise使用
Jul 27 Javascript
JavaScript中实现键值对应的字典与哈希表结构的示例
Jun 12 Javascript
jQuery+pjax简单示例汇总
Apr 21 jQuery
jQuery响应滚动条事件功能示例
Oct 14 jQuery
ztree实现左边动态生成树右边为内容详情功能
Nov 03 Javascript
javascript闭包的使用之按钮切换功能
Aug 30 Javascript
基于layui框架响应式布局的一些使用详解
Sep 16 Javascript
原生js实现购物车
Sep 23 Javascript
详解JavaScript中分解数字的三种方法
Jan 05 Javascript
Js 导出table内容到Excel的简单实例
Nov 19 #Javascript
js文本框输入点回车触发确定兼容IE、FF等
Nov 19 #Javascript
jquery.autocomplete修改实现键盘上下键自动填充示例
Nov 19 #Javascript
JS注释所产生的bug 即使注释也会执行
Nov 19 #Javascript
js计算两个时间之间天数差的实例代码
Nov 19 #Javascript
JS获取当前网址、主机地址项目根路径
Nov 19 #Javascript
jquery ajax 简单范例(界面+后台)
Nov 19 #Javascript
You might like
str_replace只替换一次字符串的方法
2013/04/09 PHP
基于PHP+Ajax实现表单验证的详解
2013/06/25 PHP
PHP 面向对象程序设计(oop)学习笔记 (四) - 异常处理类Exception
2014/06/12 PHP
PHP中文乱码解决方案
2015/03/05 PHP
ThinkPHP进程计数类Process用法实例详解
2015/09/25 PHP
extJs 下拉框联动实现代码
2010/04/09 Javascript
利用javascript打开模态对话框(示例代码)
2014/01/11 Javascript
jQuery原型属性和原型方法详解
2015/07/07 Javascript
jQuery解析Json实例详解
2015/11/24 Javascript
使用Promise链式调用解决多个异步回调的问题
2017/01/15 Javascript
jQuery EasyUI Accordion可伸缩面板组件使用详解
2017/02/28 Javascript
jquery实现左右轮播图效果
2017/09/28 jQuery
微信小程序实现跟随菜单效果和循环嵌套加载数据
2017/11/21 Javascript
深入理解Vue nextTick 机制
2018/04/28 Javascript
jQuery实现评论模块
2020/08/19 jQuery
原生js实现自定义滚动条组件
2021/01/20 Javascript
[39:02]DOTA2亚洲邀请赛 3.31 小组赛 B组 Mineski vs VGJ.T
2018/04/01 DOTA
Python中下划线的使用方法
2015/03/27 Python
python使用turtle库绘制时钟
2020/03/25 Python
python3利用venv配置虚拟环境及过程中的小问题小结
2018/08/01 Python
python的常用模块之collections模块详解
2018/12/06 Python
python之PyQt按钮右键菜单功能的实现代码
2019/08/17 Python
详解python uiautomator2 watcher的使用方法
2019/09/09 Python
解决python父线程关闭后子线程不关闭问题
2020/04/25 Python
HTML5为输入框添加语音输入功能的实现方法
2017/02/06 HTML / CSS
CAT鞋加拿大官网:CAT Footwear加拿大
2020/08/05 全球购物
商务主管岗位职责
2013/12/08 职场文书
酒店员工职业生涯规划
2014/02/25 职场文书
求职者怎样写自荐信
2014/04/13 职场文书
建筑安全生产目标责任书
2014/07/23 职场文书
2014年国庆节活动总结
2014/08/26 职场文书
2015毕业生实习期工作总结
2015/04/09 职场文书
2015年小学辅导员工作总结
2015/05/27 职场文书
工作一年自我鉴定
2019/06/20 职场文书
导游词之贵州百里杜鹃
2019/10/29 职场文书
Nginx 过滤静态资源文件的访问日志的实现
2021/03/31 Servers