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之Ajax运用 学习运用篇
Sep 26 Javascript
jQuery插件-jRating评分插件源码分析及使用方法
Dec 28 Javascript
document.createElement()用法及注意事项(ff下不兼容)
Mar 13 Javascript
jQuery/CSS3图片特效插件整理推荐
Dec 07 Javascript
jQuery实现首页顶部可伸缩广告特效代码
Apr 15 Javascript
基于javascript制作微信聊天面板
Aug 09 Javascript
原生JavaScript来实现对dom元素class的操作方法(推荐)
Aug 16 Javascript
vue服务端渲染的实例代码
Aug 28 Javascript
js时间戳与日期格式之间相互转换
Dec 11 Javascript
JavaScript基础之静态方法和实例方法分析
Dec 26 Javascript
vue-router重写push方法,解决相同路径跳转报错问题
Aug 07 Javascript
Vue proxyTable配置多个接口地址,解决跨域的问题
Sep 11 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生成rss类用法实例
2015/04/14 PHP
WAMP环境中扩展oracle函数库(oci)
2015/06/26 PHP
PHP+Apache环境中如何隐藏Apache版本
2017/11/24 PHP
用javascript父窗口控制只弹出一个子窗口
2007/04/10 Javascript
基于jquery的图片懒加载js
2010/06/30 Javascript
ajax 缓存 问题 requestheader
2010/08/01 Javascript
JavaScript Date对象 日期获取函数
2010/12/19 Javascript
js实现网站首页图片滚动显示
2013/02/04 Javascript
jquery中filter方法用法实例分析
2015/02/06 Javascript
判断输入的字符串是否是日期格式的简单方法
2016/07/11 Javascript
javascript input输入框模糊提示功能的实现
2017/09/25 Javascript
深入理解ES6 Promise 扩展always方法
2017/09/26 Javascript
vue+socket.io+express+mongodb 实现简易多房间在线群聊示例
2017/10/21 Javascript
JavaScript原型对象原理与应用分析
2018/12/27 Javascript
Vue中全局变量的定义和使用
2019/06/05 Javascript
JavaScript获取页面元素的常用方法详解
2019/09/28 Javascript
Js参数RSA加密传输之jsencrypt.js的使用
2020/02/07 Javascript
vue-cli3访问public文件夹静态资源报错的解决方式
2020/09/02 Javascript
windows10系统中安装python3.x+scrapy教程
2016/11/08 Python
python实现从pdf文件中提取文本,并自动翻译的方法
2018/11/28 Python
Python一个简单的通信程序(客户端 服务器)
2019/03/06 Python
python使用if语句实现一个猜拳游戏详解
2019/08/27 Python
Python爬虫爬取、解析数据操作示例
2020/03/27 Python
整理HTML5中支持的URL编码与字符编码
2016/02/23 HTML / CSS
美国最大的无人机经销商:DroneNerds
2018/03/20 全球购物
竞选班干部演讲稿
2014/04/24 职场文书
教育基金募捐倡议书
2014/05/14 职场文书
庆六一活动总结
2014/08/29 职场文书
2014年租房协议书范本
2014/10/30 职场文书
初中生300字旷课检讨书
2014/11/19 职场文书
匿名检举信范文
2015/03/02 职场文书
企业员工辞职信范文
2015/05/12 职场文书
2016年村干部公开承诺书(公开承诺事项)
2016/03/25 职场文书
古诗之爱国古诗5首
2019/09/20 职场文书
MySQL复制问题的三个参数分析
2021/04/07 MySQL
php修改word的实例方法
2021/11/17 PHP