浅度克隆、深度克隆

93 阅读1分钟

概念

JS有原始值(基本数据类型)跟引用值。原始值是存在栈内存中,有Number、String、Boolean、Null、Undefined、Symbol。引用值存储在堆内存中,有Array、Object、function等等。 我们使用引用值时,实际上是使用了存储的地址,地址指向实际存储空间。

因此拷贝的时候如果只是拷贝了指向空间的地址,就是浅拷贝。这样会导致两个值指向同一个空间,如果空间里的实际值变了,那么两个值都会变。

所以我们有时候需要实现深度拷贝。

实现深度克隆

function deepClone(origin,target){
//origin是原来的值,target是拷贝后的值
    var target = target || {},
    arrStr = '[object Array]'
    
    for (var prop in origin){
        if(origin.hasOwnProperty(prop)){
        //判断是否为自己的属性
            if (origin[prop] !== 'null' && typeof(origin[prop]) == 'object'){
            //判断是原始值还是引用值
                if (Object.prototype.toString.call(origin[prop]) == arrStr){
                //判断是数组还是对象
                    target[prop] = []
                }else{
                    target[prop] = {}
                }
                
                deepClone(origin[prop],target[prop]) //递归
                
            }else{
                target[prop] = origin[prop] //原始值直接赋值
            }
            
        }
    }
    return target
}