JQuery中extend使用介绍


Posted in Javascript onMarch 13, 2014

Jquery中extend的扩展方法原型是:


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

2、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"}
也就是说后面的参数如果和前面的参数存在相同的名称,那么后面的会覆盖前面的参数值。

3、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"}}
Javascript 相关文章推荐
基于jquery的3d效果实现代码
Mar 23 Javascript
JavaScript中的稀疏数组与密集数组[译]
Sep 17 Javascript
jQuery中获取Radio元素值的方法
Jul 02 Javascript
jQuery表格插件datatables用法总结
Sep 05 Javascript
Bootstrap与KnockoutJs相结合实现分页效果实例详解
May 03 Javascript
B/S(Web)实时通讯解决方案分享
Apr 06 Javascript
微信小程序 首页制作简单实例
Apr 07 Javascript
JavaScript new对象的四个过程实例浅析
Jul 31 Javascript
如何优雅的在一台vps(云主机)上面部署vue+mongodb+express项目
Jan 20 Javascript
详解关于webpack多入口热加载很慢的原因
Apr 24 Javascript
vue draggable resizable gorkys与v-chart使用与总结
Sep 05 Javascript
ant design vue导航菜单与路由配置操作
Oct 28 Javascript
js中用window.open()打开多个窗口的name问题
Mar 13 #Javascript
javascript获取浏览器类型和版本的方法(js获取浏览器版本)
Mar 13 #Javascript
利用try-catch判断变量是已声明未声明还是未赋值
Mar 12 #Javascript
jquery原创弹出层折叠效果点击折叠弹出一个层
Mar 12 #Javascript
jq实现酷炫的鼠标经过图片翻滚效果
Mar 12 #Javascript
jquery、js操作checkbox全选反选
Mar 12 #Javascript
网站繁简切换的JS遇到页面卡死的解决方法
Mar 12 #Javascript
You might like
php && 逻辑与运算符使用说明
2010/03/04 PHP
PHP把网页保存为word文件的三种方法
2014/04/01 PHP
PHP工厂模式简单实现方法示例
2018/05/23 PHP
PHP使用gearman进行异步的邮件或短信发送操作详解
2020/02/27 PHP
学习从实践开始之jQuery插件开发 菜单插件开发
2012/05/03 Javascript
鼠标焦点离开文本框时验证的js代码
2013/07/19 Javascript
jquery滚动条插件jScrollPane的使用介绍
2013/11/08 Javascript
Bootstrap的图片轮播示例代码
2015/08/31 Javascript
javascript省市区三级联动下拉框菜单实例演示
2015/11/29 Javascript
[原创]Bootstrap 中下拉菜单修改成鼠标悬停直接显示
2016/04/14 Javascript
js获取隐藏元素宽高的实现方法
2016/05/19 Javascript
微信+angularJS的SPA应用中用router进行页面跳转,jssdk校验失败问题解决
2016/09/09 Javascript
JavaScript工具库MyTools详解
2020/01/01 Javascript
[48:22]VGJ.S vs VG 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
python中redis的安装和使用
2016/12/04 Python
使用python 和 lint 删除项目无用资源的方法
2017/12/20 Python
python 绘制拟合曲线并加指定点标识的实现
2019/07/10 Python
Django 模型类(models.py)的定义详解
2019/07/19 Python
python实现的分析并统计nginx日志数据功能示例
2019/12/21 Python
xadmin使用formfield_for_dbfield函数过滤下拉表单实例
2020/04/07 Python
基于python实现把json数据转换成Excel表格
2020/05/07 Python
浅谈python处理json和redis hash的坑
2020/07/16 Python
Selenium之模拟登录铁路12306的示例代码
2020/07/31 Python
CSS3过渡transition效果实例介绍
2016/05/03 HTML / CSS
size?丹麦官网:英国伦敦的球鞋精品店
2019/04/15 全球购物
见习期自我鉴定
2013/11/07 职场文书
幼儿园老师辞职信
2014/01/20 职场文书
艺术设计专业个人求职信
2014/04/10 职场文书
保密工作责任书
2014/04/16 职场文书
运动会演讲稿
2014/05/07 职场文书
拉歌口号大全
2014/06/13 职场文书
个人四风问题整改措施思想汇报
2014/10/04 职场文书
乡镇2014法制宣传日活动总结
2014/11/01 职场文书
2014年最新版离婚协议书范本
2014/11/25 职场文书
解析原生JS getComputedStyle
2021/05/25 Javascript
Logback 使用TurboFilter实现日志级别等内容的动态修改操作
2021/08/30 Java/Android