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 相关文章推荐
ExtJS 2.0实用简明教程 之ExtJS版的Hello
Apr 29 Javascript
JavaScript根据数据生成百分比图和柱状图的实例代码
Jul 14 Javascript
微信小程序 template模板详解及实例
Feb 21 Javascript
JS排序之快速排序详解
Apr 08 Javascript
vue实现全选和反选功能
Aug 31 Javascript
JavaScript正则表达式和级联效果
Sep 14 Javascript
在vue里面设置全局变量或数据的方法
Mar 09 Javascript
解决vue A对象赋值给B对象,修改B属性会影响到A的问题
Sep 25 Javascript
JS常用排序方法实例代码解析
Mar 03 Javascript
Javascript实现简易天数计算器
May 18 Javascript
vue使用过滤器格式化日期
Jan 20 Vue.js
基于JavaScript实现年月日三级联动
Jun 22 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
无线电波是什么?它是怎样传输的?
2021/03/01 无线电
用PHP读取IMAP邮件
2006/10/09 PHP
PHP4之COOKIE支持详解
2006/10/09 PHP
php抓即时股票信息
2006/10/09 PHP
非常好用的两个PHP函数 serialize()和unserialize()
2012/02/04 PHP
PHP中的类型提示(type hinting)功能介绍
2015/07/01 PHP
php二维数组按某个键值排序的实例讲解
2019/02/15 PHP
JavaScript 保存数组到Cookie的代码
2010/04/14 Javascript
Javascript引用指针使用介绍
2012/11/07 Javascript
JavaScript中圆括号()和方括号[]的特殊用法疑问解答
2013/08/06 Javascript
在JavaScript中使用timer示例
2014/05/08 Javascript
js全选实现和判断是否有复选框选中的方法
2015/02/17 Javascript
jQuery实现带动画效果的二级下拉导航方法
2015/03/11 Javascript
ECMAScript6块级作用域及新变量声明(let)
2015/06/12 Javascript
JavaScript变量作用域_动力节点Java学院整理
2017/06/27 Javascript
详解基于node的前端项目编译时内存溢出问题
2017/08/01 Javascript
ionic2屏幕适配实现适配手机、平板等设备的示例代码
2017/08/11 Javascript
利用vue+elementUI实现部分引入组件的方法详解
2017/11/22 Javascript
JSON的parse()方法介绍
2019/01/31 Javascript
详解jQuery设置内容和属性
2019/04/11 jQuery
vue实现PC端录音功能的实例代码
2019/06/05 Javascript
JS回调函数深入理解
2019/10/16 Javascript
[00:36]DOTA2上海特级锦标赛 LGD战队宣传片
2016/03/04 DOTA
跟老齐学Python之折腾一下目录
2014/10/24 Python
Python的Django中django-userena组件的简单使用教程
2015/05/30 Python
Python 详解基本语法_函数_返回值
2017/01/22 Python
利用Python爬虫给孩子起个好名字
2017/02/14 Python
全面了解Nginx, WSGI, Flask之间的关系
2018/01/09 Python
详解pyenv下使用python matplotlib模块的问题解决
2018/11/29 Python
python 判断txt每行内容中是否包含子串并重新写入保存的实例
2020/03/12 Python
JupyterNotebook 输出窗口的显示效果调整实现
2020/09/22 Python
幼儿园保育员岗位职责
2014/04/13 职场文书
女生抽烟检讨书
2014/10/05 职场文书
2014幼儿园家长工作总结
2014/11/10 职场文书
2014年女职工工作总结
2014/11/27 职场文书
寒假生活随笔
2015/08/15 职场文书