当前位置： 移动技术网 > IT编程>开发语言>JavaScript > js的深层克隆和浅层克隆代码和理解

js的深层克隆和浅层克隆代码和理解

2018年10月24日  | 移动技术网IT编程  | 我要评论

石头人辅助天赋,亿秀,车胜元老婆李淑珍

<script>
//判断是不是原始值
//判断是数组还是对象
//建立相应的数组或对象
var obj={
               name:'辣鸡',
            sex:'male',
            card:['laobi','feiwu'],
            wife:{
                    name:'智障',
                    son:{
                        name:'彩笔'
                        }
                    }
            }
var obj1={}
function deepclone(origin,target){
      var target=target ||{},
      tostr = object.prototype.tostring,
      arrstr = '[object array]';
      for(var prop in origin){
        //第一步，判断对象是不是原始值
         if(origin.hasownproperty(prop)){
             if(typeof(origin[prop])=='object'){
                 if(tostr.call(origin[prop]) == arrstr){
                     target[prop]=[];
                          }else{
                            target[prop] = {};
                               }
                         deepclone(origin[prop],target[prop]);
                        }
                 else{
                      target[prop] = origin[prop];
                       }
                    }
                }  
}
</script>

深层克隆

注意：判断是否是原型的方法，要首先想到for in 和hasproperty的方法，然后再用typeof(origin[prop]) =='object'，

　　判断数组和对象的方法，则有三种，constructor      ,tostring call        ,instanceof

　　  此处用的是tostring.call(origin[prop]=='arrstr'),其实就是判断是否是[object array]

　　  最后递归则用回调deepclone()方法，建立相应数组和对象

 

下面是通过三目运算符完善代码，并且加了判断方法不为空，还有加了返回值target

function deepclone(origin,target){
      var target=target ||{},
      tostr = object.prototype.tostring,
      arrstr = '[object array]';
      for(var prop in origin){
        //第一步，判断对象是不是原始值
         if(origin.hasownproperty(prop)){
             if(typeof(origin[prop])=='object' && origin[prop] !=='null'){
                 target[prop] = tostr.call(origin[prop]) == arrstr ?[]: {};
                 deepclone(origin[prop],target[prop]);
                        }
                 else{
                      target[prop] = origin[prop];
                       }
                    }
                } 
                return target; 
            }

 

 

 浅层克隆

var obj3={
    name:'abc',
    sex:'boy',
    height:178}
var obj4={}

function clone(origin,target){
    var target = target||{};//防止用户不传target
    for ( prop in origin){
        target[prop]=origin[prop]
        }
　　　　return target;
    }
    clone(obj3,obj4)

 

 

需要注意的是，如果修改origin的值，则不会改变target的值

但是如果obj3里面有数组属性，调用方法改变obj4的数组属性时，也会改变obj3,因为是引用属性：

 

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网