$.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>
输出如下:
随机推荐
- JZOJ5918【NOIP2018模拟10.20】Car
题目 最近比较懒,题目描述都直接截图了. 题目大意 给你一棵树,还有树上的几条路径,一条路径上的点到路径上其它任意点的代价为111.然后是一堆询问,问从一个点到另一个点的最小代价. 思路 一开始做这题 ...
- PHP--通用化API接口数据输出 封装
/** * 通用化API接口数据输出 * author qinpeizhou * @param $message * @param array $data * @param int $httpCode ...
- VitualBox虚拟机安装CentOS, shell模式与图形化界面的相互切换
方法一:永久切换 # vi /etc/inittab 编辑 init 5 为 init 3,重启就自动进入控制台方式:反之桌面模式 方法二:当前有效 桌面模式切换shell模式:Ctrl + Alt ...
- DP学习之路(1) 01背包
动态规划是算法中一门很重要的思想,其通过对每一步的假设规划,不停的寻找最优最有利的解决方案,然后一步一步求解出来. 而01背包是其中最基本的一种dp思想,其题目一般为给定一个容量为V的背包,然后有n件 ...
- 从登录接口的响应结果里提取token
token一般存在于2个地方:1. cookie, 2 ,某个接口的响应结果中 1. 我们接口的token存在于登录接口的响应结果中,如下图: token值 为红色标记的值,在登录接口里加以下2行代码 ...
- Python实例4- 列表到字典的函数,针对好玩游戏物品清单
假设征服一条龙的战利品表示为这样的字符串列表: dragonLoot = ['gold coin', 'dagger', 'gold coin', 'gold coin', 'ruby'] 写一个名为 ...
- 5.appium命令行环境搭建及参数使用
1.安装淘宝npm(cnpm) (1)输入以下命令 :npm install -g cnpm --registry=https://registry.npm.taobao.org (2)输入cnpm ...
- php实现的支持断点续传的文件下载类
通常来说,php支持断点续传,主要依靠HTTP协议中 header HTTP_RANGE实现. HTTP断点续传原理: Http头 Range.Content-Range()HTTP头中一般断点下载时 ...
- 教你用webpack搭一个vue脚手架[超详细讲解和注释!](转载)
1.适用人群 1.对webpack知识有一定了解但不熟悉的同学. 2.女同学!!!(233333....) 2.目的 在自己对webpack有进一步了解的同时,也希望能帮到一些刚接触webpack的同 ...
- 使用innerHTML属性向head中插入字符时报“无法设置 innerHTML 属性。 该操作的目标元件无效”的错误
向head中动态插入script文件,代码如下: var sc = document.createElement("script"); sc.src = "//www.c ...