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 相关文章推荐
newxtree.js代码
Mar 13 Javascript
ASP.NET jQuery 实例13 原创jQuery文本框字符限制插件-TextArea Counter
Feb 03 Javascript
ie下jquery.getJSON的缓存问题的处理方法
Mar 29 Javascript
JavaScript实现输入框(密码框)出现提示语
Jan 12 Javascript
javascript弹出带文字信息的提示框效果
Jul 19 Javascript
javascript中的try catch异常捕获机制用法分析
Dec 14 Javascript
微信小程序 rich-text的使用方法
Aug 04 Javascript
原生JS实现瀑布流插件
Feb 06 Javascript
vue进行图片的预加载watch用法实例讲解
Feb 07 Javascript
vue项目如何刷新当前页面的方法
May 18 Javascript
vue+axios 前端实现的常用拦截的代码示例
Aug 23 Javascript
JS实现无限轮播无倒退效果
Sep 21 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
php5.5中类级别的常量使用介绍
2013/10/02 PHP
PHP批量检测并去除文件BOM头代码实例
2014/05/08 PHP
深入解析PHP的Laravel框架中的event事件操作
2016/03/21 PHP
一个简单安全的PHP验证码类 附调用方法
2016/06/24 PHP
thinkPHP框架RBAC实现原理分析
2019/02/01 PHP
脚本安需导入(装载)的三种模式的对比
2007/06/24 Javascript
javascript实现tabs选项卡切换效果(自写原生js)
2013/03/19 Javascript
jquery.post用法之type设置问题
2014/02/24 Javascript
JS表格组件BootstrapTable行内编辑解决方案x-editable
2016/09/01 Javascript
微信小程序 Windows2008 R2服务器配置TLS1.2方法
2016/12/05 Javascript
windows 下安装nodejs 环境变量设置
2017/02/02 NodeJs
手把手搭建安装基于windows的Vue.js运行环境
2017/06/12 Javascript
详解基于vue-router的动态权限控制实现方案
2017/09/28 Javascript
详解React 在服务端渲染的实现
2017/11/16 Javascript
小程序ios音频播放没声音问题的解决
2018/07/11 Javascript
小程序和web画三角形实现解析
2019/09/02 Javascript
微信小程序日历插件代码实例
2019/12/04 Javascript
[56:12]LGD vs Optic Supermajor小组赛D组胜者组决赛 BO3 第一场 6.3
2018/06/04 DOTA
Python多线程编程(五):死锁的形成
2015/04/05 Python
Python使用设计模式中的责任链模式与迭代器模式的示例
2016/03/02 Python
对Python字符串中的换行符和制表符介绍
2018/05/03 Python
对python的文件内注释 help注释方法
2018/05/23 Python
python tkinter实现屏保程序
2019/07/30 Python
Django实现CAS+OAuth2的方法示例
2019/10/30 Python
pycharm第三方库安装失败的问题及解决经验分享
2020/05/09 Python
Python实现aes加密解密多种方法解析
2020/05/15 Python
英国最大的女性服装零售商:Dorothy Perkins
2017/03/30 全球购物
Myprotein中国网站:欧洲畅销运动营养品牌
2021/02/11 全球购物
电气工程及自动化专业自荐书范文
2013/12/18 职场文书
行政人事专员岗位职责
2014/03/05 职场文书
关于读书的演讲稿
2014/05/07 职场文书
大型演出策划方案
2014/05/28 职场文书
大学新闻系自荐书
2014/05/31 职场文书
会计学毕业生求职信
2014/06/25 职场文书
小学校园文化建设汇报材料
2014/08/19 职场文书
PyQt5实现多张图片显示并滚动
2021/06/11 Python