有人问,拷贝和克隆不都是“复制”的意思吗。

  这位看官问的好,一般情况下是一样的,但在jquery中却有些不同。jqurey深度拷贝一般只js对象的复制,是$.extend()方法,jquery深度克隆一般指dom对象的复制,是$.clone()方法。

$.extend()

  语法:jQuery.extend( [deep ], target, object1 [, objectN ] )

  用途:复制js对象,或将两个或更多对象的内容合并到第一个对象。

  深浅拷贝对应的参数就是[deep],是可选的,为true或false。默认情况是false(浅拷贝),并且false是不能够显示的写出来的。如果想写,只能写true(深拷贝),在默认情况下,通过$.extend()合并操作不是递归的(浅拷贝);如果第一个对象的属性本身是一个对象或数组,那么它将完全用第二个对象相同的key重写一个属性。这些值不会被合并。然而,如果将 true 作为该函数的第一个参数,那么会在对象上进行递归的合并(深拷贝)。

  浅拷贝(false 默认):如果第二个参数对象有的属性第一个参数对象也有,那么不会进行相同参数内部的比较,直接将第一个对象的相同参数覆盖。

  深拷贝(true):如果第二个参数对象有的属性第一个参数对象也有,还要继续在这个相同的参数向下一层找,比较相同参数的对象中是否还有不一样的属性,如果有,将其继承到第一个对象,如果没有,则覆盖。

 var object1 = {
apple: 0,
banana: {
weight: 52,
price: 100
},
cherry: 97
};
var object2 = {
banana: {
price: 200
},
durian: 100
};
//默认情况浅拷贝
//object1--->{"apple":0,"banana":{"price":200},"cherry":97,"durian":100}
//object2的banner覆盖了object1的banner,但是weight属性未被继承
//$.extend(object1, object2);
//深拷贝
//object1--->{"apple":0,"banana":{"weight":52,"price":200},"cherry":97,"durian":100}
//object2的banner覆盖了object1的banner,但是weight属性也被继承了呦
$.extend(true,object1, object2);
console.log('object1--->'+JSON.stringify(object1));

$.clone()

  语法:$(selector).clone(includeEvents)

  用途:用于处理dom的克隆

  .clone()方法深度 复制所有匹配的元素集合,包括所有匹配元素、匹配元素的下级元素、文字节点。clone方法比较简单就是克隆节点,但是需要注意,如果节点有事件或者数据之类的其他处理,我们需要通过clone(ture)传递一个布尔值ture用来指定,这样不仅仅只是克隆单纯的节点结构,还要把附带的事件与数据给一并克隆了

 $("div").on('click', function() {//执行操作})
//clone处理一
$("div").clone() //只克隆了结构,事件丢失
//clone处理二
$("div").clone(true) //结构、事件与数据都克隆

Jquery的深度拷贝和深度克隆的更多相关文章

  1. java 深度拷贝 复制 深度复制

    1.深度拷贝.复制代码实现 最近需要用到比较两个对象属性的变化,其中一个是oldObj,另外一个是newObj,oldObj是newObj的前一个状态,所以需要在newObj的某个状态时,复制一个一样 ...

  2. C++ 默认拷贝构造函数 深度拷贝和浅拷贝

    C++类默认拷贝构造函数的弊端 C++类的中有两个特殊的构造函数,(1)无参构造函数,(2)拷贝构造函数.它们的特殊之处在于: (1) 当类中没有定义任何构造函数时,编译器会默认提供一个无参构造函数且 ...

  3. 【转】Java如何克隆集合——深度拷贝ArrayList和HashSet

    原文网址:http://blog.csdn.net/cool_sti/article/details/21658521 原英文链接:http://javarevisited.blogspot.hk/2 ...

  4. 浅谈BeanUtils的拷贝,深度克隆

    1.BeanUtil本地简单测试在项目中由于需要对某些对象进行深度拷贝然后进行持久化操作,想到了apache和spring都提供了BeanUtils的深度拷贝工具包,自己写了几个Demo做测试,定义了 ...

  5. lua的克隆函数,table的深度拷贝

    --深度拷贝Table function DeepCopy(obj) local InTable = {}; local function Func(obj) if type(obj) ~= &quo ...

  6. C#深度拷贝和浅度拷贝方法

    C#浅度拷贝多用于值类型的复制,即 int a=1;int b=a; 设置b=2后不会影响a的值. 但如果对于引用类型class a=new class(); class b=a; 设置b.name= ...

  7. javascript中对数组对象的深度拷贝

    在前端开发的某些逻辑中,经常需要对现有的js对象创建副本,避免污染原始数据的情况. 如果是简单的一维数组对象,可以使用两个原生方法: 1.splice var arr1 = ['a', 'b', 'c ...

  8. c#:如何处理对对象进行深度拷贝

    /// <summary> /// 对对象进行深度拷贝 /// </summary> /// <param name="obj"></pa ...

  9. JS 深度拷贝 Object Array

    JS 深度拷贝 Object Array function cloneObj(o) { var isArray = o instanceof Array; var isObject = o insta ...

随机推荐

  1. Facebook广告目标摘要

    Facebook Ads look slightly different depending on the results you want. This guide includes recommen ...

  2. 微信Android热补丁实践演进之路

    版权声明:本文由张绍文原创文章,转载请注明出处: 文章原文链接:https://www.qcloud.com/community/article/81 来源:腾云阁 https://www.qclou ...

  3. Chrome浏览器下CSS字体大小设置小于12px无效问题

    当字体大小被设置小于12px时,IE.firefox可以起作用.但chrome中仍然显示为12px大小. 解决方法为: html, body {     -webkit-text-size-adjus ...

  4. String() 函数把对象的值转换为字符串。

    var test1 = new Boolean(1);var test2 = new Boolean(0);var test3 = new Boolean(true);var test4 = new ...

  5. 【BZOJ2743】[HEOI2012]采花 离线+树状数组

    [BZOJ2743][HEOI2012]采花 Description 萧芸斓是Z国的公主,平时的一大爱好是采花. 今天天气晴朗,阳光明媚,公主清晨便去了皇宫中新建的花园采花.花园足够大,容纳了n朵花, ...

  6. jenkins前端构建

    nginx 安装yum install nginx //输入下载 or yum install epel-release //如果上一步安装失败 yum install nginx //再次下载 配置 ...

  7. 无线路由器wan口和lan口ip同网段导致无法上网解决办法

    环境 本地网段为192.168.0.0/24 路由器默认网段也是192.168.0.0/24 设置好路由器wan口DHCP自动获取ip以后无法上网 解决办法 把路由器是lan口地址设置为192.168 ...

  8. Oracle AWR 之 通过dbms_workload_repository.awr_report_text(html)函数在客户端生成AWR报告

    1.概述 一般情况下,awr报告都是通过在oracle服务器的sqlplus窗口调用$ORACLE_HOME/rdbms/admin/awrrpt.sql脚本生成报告.方法如下: [oracle@lo ...

  9. Linux救援模式

    Linux系统使用版本:CentOS 6.5 救援模式有什么作用: ◆可以更改root密码: ◆恢复硬盘.文件系统操作: ◆系统启动不来的时候,只能通过救援模式来启动: 救援模式启动的步骤如下: 1. ...

  10. linux dd命令详解及使用案例场景

    一.dd命令 dd:用指定大小的块拷贝一个文件,并在拷贝的同时进行指定的转换. 注意:指定数字的地方若以下列字符结尾,则乘以相应的数字:b=512:c=1:k=1024:w=2 参数注释: 1. if ...