<script>
//判断是不是原始值
//判断是数组还是对象
//建立相应的数组或对象
var obj={
name:'辣鸡',
sex:'male',
card:['laobi','feiwu'],
wife:{
name:'智障',
son:{
name:'彩笔'
}
}
}
var obj1={}
function deepClone(Origin,Target){
var Target=Target ||{},
toStr = Object.prototype.toString,
arrStr = '[object Array]';
for(var prop in Origin){
//第一步,判断对象是不是原始值
if(Origin.hasOwnProperty(prop)){
if(typeof(Origin[prop])=='object'){
if(toStr.call(Origin[prop]) == arrStr){
Target[prop]=[];
}else{
Target[prop] = {};
}
deepClone(Origin[prop],Target[prop]);
}
else{
Target[prop] = Origin[prop];
}
}
}
}
</script>

深层克隆

注意:判断是否是原型的方法,要首先想到for in 和hasProperty的方法,然后再用typeof(Origin[prop]) =='object',

  判断数组和对象的方法,则有三种,constructor      ,toString call        ,instanceof

    此处用的是toString.call(Origin[prop]=='arrStr'),其实就是判断是否是[object Array]

    最后递归则用回调deepClone()方法,建立相应数组和对象

下面是通过三目运算符完善代码,并且加了判断方法不为空,还有加了返回值Target

function deepClone(Origin,Target){
var Target=Target ||{},
toStr = Object.prototype.toString,
arrStr = '[object Array]';
for(var prop in Origin){
//第一步,判断对象是不是原始值
if(Origin.hasOwnProperty(prop)){
if(typeof(Origin[prop])=='object' && Origin[prop] !=='null'){
target[prop] = toStr.call(Origin[prop]) == arrStr ?[]: {};
deepClone(Origin[prop],Target[prop]);
}
else{
Target[prop] = Origin[prop];
}
}
}
return Target;
}

浅层克隆

var obj3={
name:'abc',
sex:'boy',
height:178}
var obj4={} function clone(Origin,Target){
var Target = Target||{};//防止用户不传Target
for ( prop in Origin){
Target[prop]=Origin[prop]
}
    return Target;
}
clone(obj3,obj4)

需要注意的是,如果修改Origin的值,则不会改变Target的值

但是如果obj3里面有数组属性,调用方法改变obj4的数组属性时,也会改变obj3,因为是引用属性:

js的深层克隆和浅层克隆代码和理解的更多相关文章

  1. java中浅层克隆和深层克隆

    1.浅复制与深复制概念 浅复制(浅克隆)     被复制对象的所有变量都含有与原来的对象相同的值,而所有的对其他对象的引用仍然指向原来的对象.换言之,浅复制仅仅复制所考虑的对象,而不复制它所引用的对象 ...

  2. c++中深层复制(浅层复制运行错误)成功运行-----sample

    下面随笔给出c++中深层复制(浅层复制运行错误)成功运行------sample. 浅层复制与深层复制 浅层复制 实现对象间数据元素的一一对应复制. 深层复制 当被复制的对象数据成员是指针类型时,不是 ...

  3. Java中的Clone机制(浅层复制)

    浅层复制代码: import java.util.*; class Int{ private int i; public Int(int ii){i = ii;} public void increm ...

  4. java数组对象的浅层复制与深层复制

    实际上,java中数组对象的浅层复制只是复制了对象的引用(参考),而深层复制的才是对象所代表的值.

  5. .net中String是引用类型还是值类型 以及 C#深层拷贝浅层拷贝

    http://www.cnblogs.com/yank/archive/2011/10/24/2204145.html http://www.cnblogs.com/zwq194/archive/20 ...

  6. MLDS笔记:浅层结构 vs 深层结构

    深度学习出现之前,机器学习方面的开发者通常需要仔细地设计特征.设计算法,且他们在理论上常能够得知这样设计的实际表现如何: 深度学习出现后,开发者常先尝试实验,有时候实验结果常与直觉相矛盾,实验后再找出 ...

  7. 深度学习笔记之关于基本思想、浅层学习、Neural Network和训练过程(三)

    不多说,直接上干货! 五.Deep Learning的基本思想 假设我们有一个系统S,它有n层(S1,…Sn),它的输入是I,输出是O,形象地表示为: I =>S1=>S2=>….. ...

  8. js制作带有遮罩弹出层实现登录小窗口

    要实现的效果如下 点击“登录”按钮后,弹出登录小窗口,并且有遮罩层(这个名词还是百度知道的,以前只知道效果,却不知道名字) 在没有点击“登录”按钮之前登录小窗口不显示,点击“登录”按钮后小窗口显示,并 ...

  9. struts2.1笔记01:MVC框架思想浅层理解

      1. Struts 1是全世界第一个发布的MVC框架: 它由Craig McClanahan在2001年发布,该框架一经推出,就得到了世界上Java Web开发者的拥护,经过长达6年时间的锤炼,S ...

随机推荐

  1. netty入坑第一步:了解netty和编写简单的Echo服务器和客户端

    早期java API通过原生socket产生所谓的"blocking",大致过程是这样 这种的特点是每次只能处理一个请求,如果要实现多个请求并行,就还要分配一个新的线程来给每个客户 ...

  2. 【jQuery】(2)---Jquery过滤选择器

                         1.基础选择器: 名称 说明 举例 #id 根据元素Id选择 $("divId") 选择ID为divId的元素 element 根据元素的 ...

  3. Docker容器中开始.Net Core之路

    开始写这篇博客前,已经尝试练习过好多次Docker环境安装,.Net Core环境安装了,在这里替腾讯云做一个推广,假如我们想学习.练手.net core 或是Docker却苦于没有开发环境,服务器也 ...

  4. JVM读书笔记之OOM

    在Java虚拟机规范的描述中,除了程序计数器外,虚拟机内存的其他几个运行时区域都有发生OutOfMemoryError(OOM)异常的可能,本文总结了若干实例来验证异常及发生的场景. 下文代码的开头都 ...

  5. String的split方法,你真的懂吗

    String的split方法相信大家都不陌生,或多或少都用过它将字符串转成一个数组,但是就是这样一个简单的方法,里面也有一个不得不注意.不深不浅的小坑. 本地测试代码如下图所示: 图1 大家会发现sp ...

  6. Cookie提要

    Cookie的基本概念和设置  Cookie在远程浏览器端存储数据并以此跟踪和识别用户的机制.从实现上说,Cookie是存储在客户端上的小段数据,浏览器(即客户端)通过HTTP协议和服务器端进行Coo ...

  7. Perl列表相关函数

    内置的列表函数有: grep, join, map, qw//, reverse, sort, unpack join:将多个元素使用给定字符串联起来join grep:从列表中筛选符合条件的元素执行 ...

  8. ARM 汇编指令 DCD

    简介 DCD:数据定义( Data Definition )伪指令 一般用于为特定的数据分配存储单元,同时可完成已分配存储单元的初始化. 语法格式: 标号 DCD(或 DCDU) 表达式 DCD(或 ...

  9. 分布式系统监视zabbix讲解二之邮件报警通知--技术流ken

    概述 在上一篇博客<分布式系统监视zabbix讲解一技术流ken>中已经详细讲解了如何安装zabbix,本篇博客将详细讲解如何使用zabbix监控另外一台主机,并实现email报警通知机制 ...

  10. ___Jquery多选框的取值及反显数据

    Jquery操作 ------------------------------------------------------ var arr = new Array(); $("input ...