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>

输出如下:

随机推荐

  1. JZOJ5918【NOIP2018模拟10.20】Car

    题目 最近比较懒,题目描述都直接截图了. 题目大意 给你一棵树,还有树上的几条路径,一条路径上的点到路径上其它任意点的代价为111.然后是一堆询问,问从一个点到另一个点的最小代价. 思路 一开始做这题 ...

  2. PHP--通用化API接口数据输出 封装

    /** * 通用化API接口数据输出 * author qinpeizhou * @param $message * @param array $data * @param int $httpCode ...

  3. VitualBox虚拟机安装CentOS, shell模式与图形化界面的相互切换

    方法一:永久切换 # vi /etc/inittab 编辑 init 5 为 init 3,重启就自动进入控制台方式:反之桌面模式 方法二:当前有效 桌面模式切换shell模式:Ctrl + Alt ...

  4. DP学习之路(1) 01背包

    动态规划是算法中一门很重要的思想,其通过对每一步的假设规划,不停的寻找最优最有利的解决方案,然后一步一步求解出来. 而01背包是其中最基本的一种dp思想,其题目一般为给定一个容量为V的背包,然后有n件 ...

  5. 从登录接口的响应结果里提取token

    token一般存在于2个地方:1. cookie, 2 ,某个接口的响应结果中 1. 我们接口的token存在于登录接口的响应结果中,如下图: token值 为红色标记的值,在登录接口里加以下2行代码 ...

  6. Python实例4- 列表到字典的函数,针对好玩游戏物品清单

    假设征服一条龙的战利品表示为这样的字符串列表: dragonLoot = ['gold coin', 'dagger', 'gold coin', 'gold coin', 'ruby'] 写一个名为 ...

  7. 5.appium命令行环境搭建及参数使用

    1.安装淘宝npm(cnpm) (1)输入以下命令 :npm install -g cnpm --registry=https://registry.npm.taobao.org (2)输入cnpm ...

  8. php实现的支持断点续传的文件下载类

    通常来说,php支持断点续传,主要依靠HTTP协议中 header HTTP_RANGE实现. HTTP断点续传原理: Http头 Range.Content-Range()HTTP头中一般断点下载时 ...

  9. 教你用webpack搭一个vue脚手架[超详细讲解和注释!](转载)

    1.适用人群 1.对webpack知识有一定了解但不熟悉的同学. 2.女同学!!!(233333....) 2.目的 在自己对webpack有进一步了解的同时,也希望能帮到一些刚接触webpack的同 ...

  10. 使用innerHTML属性向head中插入字符时报“无法设置 innerHTML 属性。 该操作的目标元件无效”的错误

    向head中动态插入script文件,代码如下: var sc = document.createElement("script"); sc.src = "//www.c ...