浅拷贝和深拷贝针对的是Object、Array这样复杂的引用类型数据
简单说:浅拷贝只复制一层的属性,而深拷贝则递归复制所有层级的属性
一、浅拷贝
1 function clone(origin, target) { 2 var result = target || {}; 3 for ( var prop in origin ){ 4 target[prop] = origin[prop]; 5 } 6 return result; 7 }
如果对象的属性值是数组或对象,实际上,存储的值是一个内存地址;
原始数据和拷贝的数据指向的是同一个地址,可能别篡改。
二、深拷贝
思路:
遍历对象 for (var prop in obj)
1. 判断是不是原始值 typeof() object
2. 判断是数组还是对象 instanceof constructor toString(在iframe父子作用域中依旧正确)
3. 建立相应的数组或对象 然后递归
1 function deepClone(origin, target) { 2 var target = target || {}, 3 toStr = Object.prototype.toString, 4 arrStr = "[object Array]"; 5 for(var prop in origin) { 6 // 判断对象是否包含特定的自身属性 7 if(origin.hasOwnProperty(prop)) { 8 // 排除null这个特殊的object并且是对象类型的引用类型数据 9 if(origin[prop] !== null && typeof(origin[prop]) == ‘object‘){ 10 target[prop] = (toStr.call(origin[prop]) == arrStr) ? [] : {}; 11 deepClone(origin[prop], target[prop]); 12 }else{ 13 // 拷贝基本类型数据 14 target[prop] = origin[prop]; 15 } 16 } 17 } 18 return target; 19 }
深拷贝不仅将原对象的基本类型数据拷贝,而且将原对象上的引用类型数据采用递归的方式拷贝到新的对象上。这样就不会出现引用类型数据指向同一对象的问题。
jQuery提供了 $.extend() 深浅拷贝方法
浅拷贝:$.extend({}, obj1, obj2);
深拷贝:$.extend(true, obj1, obj2);
原文地址:https://www.cnblogs.com/yuxi2018/p/9445393.html
时间: 2024-10-27 18:09:50