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剩余字数计算的代码
Jul 03 Javascript
基于jQuery的动态表格插件
Mar 28 Javascript
jquery ajax方式直接提交整个表单核心代码
Aug 15 Javascript
setTimeout()与setInterval()方法区别介绍
Dec 24 Javascript
js数字转换为float,取N位小数
Feb 08 Javascript
JS实现自动变化的导航菜单效果代码
Sep 09 Javascript
Vue实现一个返回顶部backToTop组件
Jul 25 Javascript
jQuery的时间datetime控件在AngularJs中的使用实例(分享)
Aug 17 jQuery
localstorage实现带过期时间的缓存功能
Jun 28 Javascript
Node.JS获取GET,POST数据之queryString模块使用方法详解
Feb 06 Javascript
vue下拉刷新组件的开发及slot的使用详解
Dec 23 Vue.js
vue3.0自定义指令(drectives)知识点总结
Dec 27 Vue.js
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
全国FM电台频率大全 - 26 西藏自治区
2020/03/11 无线电
利用php+mysql来做一个功能强大的在线计算器
2010/10/12 PHP
PHP多线程批量采集下载美女图片的实现代码(续)
2013/06/03 PHP
php截取字符串函数substr,iconv_substr,mb_substr示例以及优劣分析
2014/06/10 PHP
PHPMailer发送HTML内容、带附件的邮件实例
2014/07/01 PHP
PHP之autoload运行机制实例分析
2014/08/28 PHP
php生成高清缩略图实例详解
2015/12/07 PHP
jquery ajax提交表单数据的两种方式
2009/11/24 Javascript
js遍历td tr等html元素
2012/12/13 Javascript
JavaScript跨域方法汇总
2014/10/16 Javascript
js判断子窗体是否关闭的方法
2015/08/11 Javascript
有关JavaScript中call()和apply() 的一些理解
2016/05/20 Javascript
Bootstrap自动适应PC、平板、手机的Bootstrap栅格系统
2016/05/27 Javascript
省市区三级联动jquery实现代码
2020/04/15 Javascript
详谈$.data()的用法和作用
2017/02/13 Javascript
vue.js组件之间传递数据的方法
2017/07/10 Javascript
bootstrap confirmation按钮提示组件使用详解
2017/08/22 Javascript
JavaScript 中的 this 简单规则
2017/09/19 Javascript
Vue项目总结之webpack常规打包优化方案
2019/06/06 Javascript
Node.js控制台彩色输出的方法与原理实例详解
2019/12/01 Javascript
JS简易计算器实例讲解
2020/06/30 Javascript
简单了解three.js 着色器材质
2020/08/03 Javascript
Python中使用Beautiful Soup库的超详细教程
2015/04/30 Python
Python中函数的参数定义和可变参数用法实例分析
2015/06/04 Python
Python中文字符串截取问题
2015/06/15 Python
使用python Fabric动态修改远程机器hosts的方法
2018/10/26 Python
pyftplib中文乱码问题解决方案
2020/01/11 Python
CSS3 简单又实用的5个属性
2010/03/04 HTML / CSS
别名指示符是什么
2012/10/08 面试题
护理专业本科生自荐信
2013/10/01 职场文书
联谊活动策划书
2014/01/26 职场文书
财务总监管理岗位职责
2014/03/08 职场文书
小学生运动会通讯稿
2014/09/23 职场文书
有关西游记的读书笔记
2015/06/25 职场文书
运动会广播稿300字
2015/08/19 职场文书
让JavaScript代码更加精简的方法技巧
2022/06/01 Javascript