码迷,mamicode.com
首页 > 编程语言 > 详细

JavaScript深拷贝实现原理简析

时间:2020-05-30 21:37:58      阅读:153      评论:0      收藏:0      [点我收藏+]

标签:依赖   两种   false   lse   附加   对象   处理   java   ||   

  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深拷贝实现原理简析

标签:依赖   两种   false   lse   附加   对象   处理   java   ||   

原文地址:https://www.cnblogs.com/hongqdt/p/12995053.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!