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日历 推荐
Dec 03 Javascript
JavaScript面向对象之Prototypes和继承
Jul 12 Javascript
jQuery异步验证用户名是否存在示例代码
May 21 Javascript
jquery 插件实现瀑布流图片展示实例
Apr 03 Javascript
JavaScript Function函数类型介绍
Apr 08 Javascript
JS中实现函数return多个返回值的实例
Feb 21 Javascript
Angular.js实现多个checkbox只能选择一个的方法示例
Feb 24 Javascript
基于vue实现swipe轮播组件实例代码
May 24 Javascript
vue编译打包本地查看index文件的方法
Feb 23 Javascript
JS改变页面颜色源码分享
Feb 24 Javascript
vue 移动端适配方案详解
Nov 15 Javascript
vue-treeselect的基本用法以及解决点击无法出现拉下菜单
Apr 30 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
世界上第一台立体声收音机
2021/03/01 无线电
腾讯微博提示missing parameter errorcode 102 错误的解决方法
2014/12/22 PHP
php实现购物车功能(上)
2020/07/23 PHP
PHP+HTML+JavaScript+Css实现简单爬虫开发
2016/03/28 PHP
juqery 学习之三 选择器 子元素与表单
2010/11/25 Javascript
js 固定悬浮效果实现思路代码
2013/08/02 Javascript
js中reverse函数的用法详解
2013/12/26 Javascript
详细解密jsonp跨域请求
2015/04/15 Javascript
JS仿百度自动下拉框模糊匹配提示
2016/07/25 Javascript
BootstrapValidator不触发校验的实现代码
2016/09/28 Javascript
JavaScript 深层克隆对象详解及实例
2016/11/03 Javascript
JavaScript实现事件的中断传播和行为阻止方法示例
2017/01/20 Javascript
用jQuery旋转插件jqueryrotate制作转盘抽奖
2017/02/10 Javascript
基于jQuery和CSS3实现APPLE TV海报视差效果
2017/06/16 jQuery
使用JavaScript实现表格编辑器(实例讲解)
2017/08/02 Javascript
详解vue2 $watch要注意的问题
2017/09/08 Javascript
vue mint-ui 实现省市区街道4级联动示例(仿淘宝京东收货地址4级联动)
2017/10/16 Javascript
node.js实现上传文件功能
2019/07/15 Javascript
[13:25]VP vs VICI (BO3)
2018/06/07 DOTA
python实现电子词典
2020/04/23 Python
Django1.3添加app提示模块不存在的解决方法
2014/08/26 Python
详解字典树Trie结构及其Python代码实现
2016/06/03 Python
python+opencv识别图片中的圆形
2020/03/25 Python
Windows 8.1 64bit下搭建 Scrapy 0.22 环境
2018/11/18 Python
python常用函数与用法示例
2019/07/02 Python
python使用yield压平嵌套字典的超简单方法
2019/11/02 Python
Tensorflow 多线程设置方式
2020/02/06 Python
Python异常原理及异常捕捉实现过程解析
2020/03/25 Python
python一些性能分析的技巧
2020/08/30 Python
Helly Hansen工作服美国官方网上商店:为最恶劣的环境
2019/09/04 全球购物
int *p=NULL和*p= NULL有什么区别
2014/10/23 面试题
优秀毕业大学生推荐信
2013/11/13 职场文书
入党积极分子思想汇报范文
2014/01/05 职场文书
《小池塘》教学反思
2014/02/28 职场文书
体操比赛口号
2014/06/10 职场文书
党的群众路线教育实践活动个人对照检查材料(医生)
2014/11/05 职场文书