js深浅拷贝

·  阅读 256
js深浅拷贝

浅拷贝:

  如果是基本类型拷贝,新值不会影响旧值,

  如果是引用类型拷贝,只会拷贝第一层,并且指向与旧值指向同一个地址

  引用类型拷贝有个其他理解:

  浅拷贝是按位拷贝对象,它会创建一个新对象,这个对象有着原始对象属性值的一份精确拷贝。如果属性是基本类型,拷贝的就是基本类型的值;如果属性是内存地址(引用类型),拷贝的就是内存地址 ,因此如果其中一个对象改变了这个地址,就会影响到另一个对象。即默认拷贝构造函数只是对对象进行浅拷贝复制(逐个成员依次拷贝),即只复制对象空间而不复制资源。(参考

深拷贝:

  重新生成一个对象,并且拥有新的地址,内容与就地址相同,但互不影响

浅拷贝方法:

1.
const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };

const returnedTarget = Object.assign(target, source);

2.

function shallowCopy(src) {
   var dst = {};
   for (var prop in src) {
       if (src.hasOwnProperty(prop)) {
           dst[prop] = src[prop];
       }
   }
   return dst;
}
3.
[...arr2] = arr;
复制代码

深拷贝方法:

1.
function deepClone(obj){
    let objClone = Array.isArray(obj)?[]:{};
    if(obj && typeof obj==="object"){
        for(key in obj){
            if(obj.hasOwnProperty(key)){
                //判断ojb子元素是否为对象,如果是,递归复制
                if(obj[key]&&typeof obj[key] ==="object"){
                    objClone[key] = deepClone(obj[key]);
                }else{
                    //如果不是,简单复制
                    objClone[key] = obj[key];
                }
            }
        }
    }
    return objClone;
} 
2.
JSON.parse(JSON.stringify(arr))
//缺点:对函数,时间,NAN不友好,会返回null
复制代码
分类:
前端