浅拷贝和深拷贝都是只针对Object,Array这样的复杂对象。浅拷贝只复制一层对象的属性,而深拷贝则是递归复制了所有层级。
浅拷贝的实现:
var obj = { a: 1, arr: [2, 3]};
var shallowObj = shallowCopy(obj);
function shallowCopy(obj){
var dist = {};
for(var prop in obj){
if(obj.hasOwnProperty(prop)){
dist[prop] = obj[prop];
}
}
return dist;
}
由于js存储对象都是存储地址,所以浅拷贝会导致复制出的新对象和原对象指向同一块内存地址。若改变一个值,会导致另一个对象同时变化。
深拷贝则不同,不仅将原对象的各个属性逐个复制出去,而且将原对象各个属性包含的对象也以递归方式依次复制到新对象中,重新开辟一个空间存储新对象。
深拷贝的实现:
function deepClone(obj){
var newObj = obj.constructor === Array ? [] : {}
if(typeof obj !== 'Object'){
return
}else if( window.JSON){
newObj = JSON.parse(JSON.stringify(obj));
} else {
for (var i in obj){
newObj[i] = typeof obj[i] === 'Object' ? deepClone(obj[i]) : obj[i];
}
}
return newObj;
}
另外,jq也提供了拷贝的方法——extend
JQuery.extend(true,obj);
第一个参数是布尔值,用来设置是否进行深拷贝。
还有一种可以实现深拷贝:JSON.parse(JSON.stringify(obj))。