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 相关文章推荐
js函数的延迟加载实现代码
Oct 11 Javascript
js生成动态表格并为每个单元格添加单击事件的方法
Apr 14 Javascript
使用jQuery实现图片遮罩半透明坠落遮挡
Mar 16 Javascript
JS自动倒计时30秒后按钮才可用(两种场景)
Aug 31 Javascript
基于JS实现省市联动效果代码分享
Jun 06 Javascript
JS正则表达式修饰符中multiline(/m)用法分析
Dec 27 Javascript
原生js实现弹出层效果
Jan 20 Javascript
微信小程序开发之好友列表字母列表跳转对应位置
Sep 26 Javascript
iview table高度动态设置方法
Mar 14 Javascript
js运算符的一些特殊用法
Jul 29 Javascript
vue获取元素宽、高、距离左边距离,右,上距离等还有XY坐标轴的方法
Sep 05 Javascript
微信小程序如何调用新闻接口实现列表循环
Jul 02 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 执行系统外部命令 system() exec() passthru()
2009/08/11 PHP
php程序员应具有的7种能力小结
2014/11/27 PHP
PHP高并发和大流量解决方案整理
2021/03/09 PHP
随鼠标移动的时钟非常漂亮遗憾的是只支持IE
2014/08/12 Javascript
jQuery取消ajax请求的方法
2015/06/09 Javascript
javascript图片预加载实例分析
2015/07/16 Javascript
举例讲解Node.js中的Writable对象
2015/07/29 Javascript
简单的jQuery banner图片轮播实例代码
2016/03/04 Javascript
字符串反转_JavaScript
2016/04/28 Javascript
第一次接触神奇的Bootstrap基础排版
2016/07/26 Javascript
JS实现动画兼容性的transition和transform实例分析
2016/12/13 Javascript
vue 实现全选全不选的示例代码
2018/03/29 Javascript
vuex进阶知识点巩固
2018/05/20 Javascript
详解封装基础的angular4的request请求方法
2018/06/05 Javascript
jQuery序列化form表单数据为JSON对象的实现方法
2018/09/20 jQuery
JS尾递归的实现方法及代码优化技巧
2019/01/19 Javascript
JavaScript实现的联动菜单特效示例
2019/07/08 Javascript
javascript实现简单搜索功能
2020/03/26 Javascript
vue中jsonp插件的使用方法示例
2020/09/10 Javascript
vue实现单一筛选、删除筛选条件
2020/10/26 Javascript
[01:35:53]完美世界DOTA2联赛PWL S3 Magma vs GXR 第二场 12.13
2020/12/17 DOTA
Python实现从URL地址提取文件名的方法
2015/05/15 Python
Python实现二维数组按照某行或列排序的方法【numpy lexsort】
2017/09/22 Python
python中bytes和str类型的区别
2019/10/21 Python
python+selenium+chromedriver实现爬虫示例代码
2020/04/10 Python
django正续或者倒序查库实例
2020/05/19 Python
Python生成器next方法和send方法区别详解
2020/05/30 Python
Python实现播放和录制声音的功能
2020/08/12 Python
python 爬取小说并下载的示例
2020/12/07 Python
python包的导入方式总结
2021/03/02 Python
Java的类与C++的类有什么不同
2014/01/18 面试题
婚纱摄影师求职信
2014/03/07 职场文书
廉洁自律承诺书
2014/03/27 职场文书
新闻报道稿范文
2015/07/23 职场文书
作文之亲情600字
2019/09/23 职场文书
解决Django transaction进行事务管理踩过的坑
2021/04/24 Python