$.extend用法详解(一)
jQuery.extend( target [, object1 ] [, objectN ] )
在这里target是Object,它有两个作用:
1. 如果后面没有对应的object1及objectN等等,它的作用就是给jQuery命名空间本身对象进行扩展,可以为jQuery增加新的共用方法和属性。
2.存在object1,及objectN等等,object1,objct2,...objectN会合并到target中,返回值为合并后的target,由此可以看出该方法合并后,是修改了target的结构的。
如果不想修改原始对象的结构,可以创建target为空对象,将后面的对象属性合并到target中,然后返回给新的object中:

同时,如果后面的参数如果和前面的参数存在相同的名称,那么后面的会覆盖前面的参数值。
demo如下:
var obj1 = {
apple:,
banana:{
weight:,price:
},
cherry:
}
var obj2 = {
banana:{price:},
durian:
}
var obj = $.extend(obj1,obj2);
console.log("obj1为",obj1);
console.log("obj为",obj);
输出:
由此可知,obj1的被修改,和obj都指向同一个对象,并且,参数相同的话,后面对象会覆盖前面。
var obj = $.extend({},obj1,obj2);
console.log(obj);
这个obj也指向了同一个对象。

二,jQuery.extend( [deep ], target, object1 [, objectN ] )
在这里第一个参数deep代表是否进行深度拷贝,有两个参数true和false。
下面看官网的例子:
var object1 = {
apple: 0,
banana: { weight: 52, price: 100 },
cherry: 97
};
var object2 = {
banana: { price: 200 },
durian: 100
};
// Merge object2 into object1, recursively
var obj = $.extend( true, object1, object2 );
console.log("object1:",object1);
console.log("obj:",obj);
输出:

深拷贝,也就是说它会将object中的嵌套子对象也进行合并。
如果参数为false的话,代码如下:
var obj = $.extend(false, object1, object2 );
console.log("object1:",object1);
console.log("obj:",obj);
输出如下:
输出:
由此可知,false的话object1对象还是原来的结构,没有合并;得到的结果obj则是object1和object2的浅复制。
下面在看两个小例子:
<script>
var result=$.extend( true, {},
{ name: "John", location: {city: "Boston",county:"USA"} },
{ last: "Resig", location: {state: "MA",county:"China"} } );
console.log(result); </script>
输出结果如下:

<script>
var result=$.extend( false, {},
{ name: "John", location: {city: "Boston",county:"USA"} },
{ last: "Resig", location: {state: "MA",county:"China"} } );
console.log(result); </script>
输出如下:

随机推荐
- HZOI20190818模拟25题解
题面:https://www.cnblogs.com/Juve/articles/11372379.html A:字符串 其实是CATALAN数水题... 和网格一毛一样:https://www.cn ...
- python验证码识别PIL+pytesseract
1.需要模块安装 在python安装目录scripts即: 执行pip install pillow 下载tesseract-ocr-setup-4.00.00dev.exe 安装,我的目录在C盘默认 ...
- (转载)My97 datepicker使用指南
这里先显示大家都可以看到的My97DatePicker的用法: WdatePicker日历控件使用方法(http://www.cnblogs.com/yuhanzhong/archive/2011/0 ...
- 分享非常漂亮的WPF界面框架源码及插件化实现原理
在上文<分享一个非常漂亮的WPF界面框架>中我简单的介绍了一个界面框架,有朋友已经指出了,这个界面框架是基于ModernUI来实现的,在该文我将分享所有的源码,并详细描述如何基于Mod ...
- 推荐大家一个个人觉得超级好的Java学习网站
https://how2j.cn?p=16567 这是网址,网站里有Java基础,Javaweb.框架.数据库.工具.面试题等等的,站长一直在更新新的知识,很好用哦
- POJ 2533 最小上升子序列
D - POJ 2533 经典DP-最长上升子序列 A numeric sequence of ai is ordered if a1 < a2 < ... < aN. Let th ...
- 【html、CSS、javascript-1】html基础
HTML 翻译成代码如下: web: import socket def handle_request(client): buf = client.recv(1024) client.sendal ...
- Linux下perl模块安装
perl模块下载地址: http://search.cpan.org/ 假设放在/usr/local/src/下 cd /usr/local/src 上传下载的压缩包CGI-Session-3.95. ...
- mac上mamp用navigate连接不上
参考 http://blog.sina.com.cn/s/blog_6742643c0100r9qp.html
- xampp中tomcat服务器无法启动
xampp中的Tomcat服务器无法启动的问题... 我的Java中自己安装了Tomcat服务器,webstorm中还有一个php服务器,,,xampp中的能不能用我就不需要去理会了...反正tomc ...