Javascript深度拷贝

博客介绍了用递归思想进行JS对象深度拷贝并封装的方法。先判断是否为原始值,再区分是数组还是对象,建立相应结构后循环递归。还展示了用三目运算符简化代码,最后创建对象执行深度拷贝。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

这里用递归的思想进行JS对象的深度拷贝,并进行封装,思路如下
  1. 判断是不是原始值 使用方法:typeof()/object

  2. 判断是数组还是对象 使用方法: instanceof toString constructor

  3. 建立相应的数组或对象

  4. 循环递归

	function deepClone(origin,target){
		var target = target || {},
			toStr = Object.prototype.toString,
			arr = "[object Array]";

		for(var prop in origin){
			if(origin.hasOwnProperty(prop)){ //选择自己的属性
				if(origin[prop] !== 'null' && typeof(origin[prop]) == 'object'){//区分原始值和引用值
					if(toStr.call(origin[prop]) == arr){//区分数组和对象
						target[prop] = [];//建立数组
					}else{
						target[prop] = {};//建立对象
					}
					deepClone(origin[prop],target[prop]); //循环递归
				}else{
					target[prop] = origin[prop];
				}
			}
		}
		return target;
	}复制代码

代码可以将中间target[prop]赋值操作用三目运算符简化如下:

target[prop] = (toStr.call(origin[prop]) == arr) ? [] : {};

因此 简化后的深度拷贝的代码最后如下:
function deepClone(origin,target){
    var target = target || {},//容错
    toStr = Object.prototype.toString,//.call
    arr = "[object Array]";//数组原型

    for(var prop in origin){
        if(origin.hasOwnProperty(prop)){//判断是否是自己的属性
            if(origin[prop] !== 'null' && typeof(origin[prop]) == 'object'){//判断引用值还是原始值
	        target[prop] = (toStr.call(origin[prop]) == arr) ? [] : {};//判断是数组还是对象 然后相应建立数组/对象
		deepClone(origin[prop], target[prop]);//循环递归
	    }else{//原始值
		target[prop] = origin[prop];
	    }
         }
    }
    return target;
}复制代码

最后,我们可以创建两个对象来进行深度拷贝
var obj1 = {
    name : 'sunny',
    age : 100,
    sayName : function(){
    console.log(this.name);
    }
}
var obj2 = {};复制代码

执行拷贝

deepClone(obj1, obj2);//放入源对象和拷贝对象复制代码


转载于:https://juejin.im/post/5d074f5351882523be6a9446

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值