首页 > 编程语言 > 详细

JavaScript深拷贝实现原理简析

时间:2018-07-27 22:57:41      阅读:220      评论:0      收藏:0      [点我收藏+]

 Why: 引用类型拷贝为了不出现数据共享问题,需要使用深拷贝。

 So:  

 1.内部原理:

 1 function inCopy(obj1,obj2) {
 2     var obj1 = obj1 || {};//容错处理
 3     for (var k in obj2) { 
 4         if(obj2.hasOwnProperty(k)){ //只拷贝实例属性,不进行原型的拷贝
 5             if(typeof obj2[k] == ‘object‘) { //引用类型的数据单独处理
 6                 obj1[k] = Array.isArray(obj2[k])?[]:{};
 7                 inCopy(obj1[k],obj2[k]); //递归处理引用类型数据
 8             }else{
 9                 obj1[k] = obj2[k]; //值类型的数据直接进行拷贝
10             }
11         }
12     }
13 }

 2. 除了递归,我们还可以借用JSON对象的parse和stringify:

function deepClone(obj){
    let _obj = JSON.stringify(obj),
        objClone = JSON.parse(_obj);
    return objClone
}    
let a=[0,1,[2,3],4],
    b=deepClone(a);
a[0]=1;
a[2][0]=1;
console.log(a,b);

3.除了上面两种方法之外,我们还可以借用JQ的extend方法。

$.extend( [deep ], target, object1 [, objectN ] )

deep表示是否深拷贝,为true为深拷贝,为false,则为浅拷贝

target Object类型 目标对象,其他对象的成员属性将被附加到该对象上。

object1  objectN可选。 Object类型 第一个以及第N个被合并的对象。 

let a=[0,1,[2,3],4],
    b=$.extend(true,[],a);
a[0]=1;
a[2][0]=1;
console.log(a,b);

可以看到,效果与上面方法一样,只是需要依赖JQ库。

JavaScript深拷贝实现原理简析

原文:https://www.cnblogs.com/yehaojun/p/9380020.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!