首页 > Web开发 > 详细

Js深度克隆解析

时间:2018-06-18 22:07:15      阅读:277      评论:0      收藏:0      [点我收藏+]

Js克隆(clone),就是数据拷贝,包括基础类型的数据和引用类型的数据,而深度克隆(deepClone)就是针对引用类型,如数组和对象。

两种拷贝的区别在于:浅拷贝时,拷贝出的对象指向原对象的地址,当其值发生改变时,原对象的值也发生改变;

               深度拷贝,拷贝出的对象指向一个新的地址,当其值发生改变时,原对象的值不受影响。

下面列出深度拷贝的代码及其详细注释:

var obj = {//待拷贝的对象
   name:"abc",
   age:"123",
   card:[‘visa‘,‘master‘],
   wife:{
   name:"bcd",
   son:{
     name:"aaa"
   }
   },
   a:function(){}
  }

function deepclone(origin , target){
  var target = target || {},
      tostr = Object.prototype.toString,//使用Object.prototype.toString.call方法进行对象和数组的区分,所以先将其进行存储以便使用
      arr = ‘[object Array]‘;
  for(var prop in origin){
      if(origin.hasOwnProperty(prop)){//防止拷贝的对象从原对象的原型上取值
          if(origin[prop] !== "null" && typeof(origin[prop]) == ‘object‘){//当遍历到的数据为对象或数组时调用Object.prototype.toString.call方法
              if(tostr.call(origin[prop]) == arr){//遍历到数组,创建数组
                  target[prop] = [];
              }else{//遍历到对象,创建对象
                 target[prop] = {};
              }             
              deepclone(origin[prop] , target[prop]);//对遍历到的数组和对象再次深度克隆
         }else{
             target[prop] = origin[prop];//当遍历到的数据为原始值时,直接进行赋值
         }
     }
 }
         return target;
 }

var target;
console.log(deepclone(obj,target));//实现target深度拷贝obj

 

Js深度克隆解析

原文:https://www.cnblogs.com/77days/p/9196243.html

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