复制所有属性进行继承 转自 博客园 汤姆大叔 深入理解JavaScript系列(46):代码复用模式(推荐篇)

本文介绍了JavaScript中实现对象的浅拷贝和深拷贝的方法,并通过示例对比了两者之间的区别。浅拷贝仅复制对象的第一层属性,而深拷贝则递归复制所有层级的对象。
//浅拷贝
function extend (parent,child){ 
var i; 
child = child||{}; 
for(i in parent){
 if(parent.hasOwnProperty(i)){
 child[i]=parent[i]; 
} 
} 
return child;
}
var dad = {name:"Adam"};
var kid = extend(dad);
console.log(kid.name); //"Adam" 
var dad={ counts:[1,2,3], 
reads={paper:true};};
var kid = extend(parent);
kid.counts.push(4);console.log(dad.counts.toString());//"1,2,3,4"
console.log(dad.reads === kid.reads);// true

//dad和kid的reads是一样的,也就是他们使用的是同一个引用,这也就是浅拷贝带来的问题
//深拷贝
function extendDeep(parent,child){ 
var i, 
toStr = Object.prototype.toString; 
astr = "[object Array]"; 
child = child||{}; 
for(i in parent){ 
if(parent.hasOwnProperty(i)){
 if(typeof parent[i] === 'object'){
 child[i] = (toStr.call(parent[i])===astr) ?[]:{}; 
extendDeep(parent[i],child[i]); 
}else{ 
child[i]=parent[i];
 } 
} 
}
 return child;
}
var dad={counts:[1,2,3],
reads:{paper : true}};
var kid = extendDeep(dad);
kid.counts.push(4);console.log(kid.counts.toString()); //"1,2,3,4"
console.log(parent.counts.toString());//"1,2,3"
console.log(dad.reads === kid.reads); //false


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值