JS中深浅拷贝 函数封装代码

  一、了解

基本数据类型保存在栈内存中,按值访问,引用数据类型保存在堆内存中,按址访问。

  二、浅拷贝

浅拷贝只是复制了指向某个对象的指针,而不是复制对象本身,新旧对象其实是同一内存地址的数据,修改其中一个值,另一个也会动态改变。

  三、深拷贝

深拷贝是真正意义上实现了数组和对象的拷贝,它创建了另外一个一模一样的对象,和原对象不是一个内存地址,修改一个值不会影响另一个的值。

使用JSON.stringify()和JSON.parse()也可以实现深拷贝。当值为undefined、任意函数、symbol时会被忽略。

let newobj = JSON.parse(JSON.stringify(obj));

  四、封装实现深浅拷贝的函数

//封装函数 实现深浅拷贝  deep为true深拷贝 false浅拷贝
    function copy(oldObj,deep){
        let newObj = {};
        if (oldObj instanceof Array){
            newObj = [];
        }
        for (let key in oldObj){
            let value = oldObj[key];
            if (!!deep && typeof value === "object" && value !== null){ //如果原对象的某个属性是引用类型数据,递归调用copy
                newObj[key] = copy(value,deep);
            } else{            //如果原对象的某个属性是基本类型数据,直接将此属性赋值给新对象的相应属性
                newObj[key] = value;
            }
        }
        return newObj;
    }

效果如下:

let obj1 = {a:1,b:{c:2}};
let obj2 = copy(obj1,true);  //深拷贝
let obj3 = copy(obj1,false); //浅拷贝
obj1.b.c = 3;
console.log(obj2);  //{a:1,b:{c:2}}
console.log(obj3);  //{a:1,b:{c:3}}

本文仅仅简述了js深浅拷贝,以及实现深浅拷贝的简单代码,如有不当之处,请各位指正!谢谢!

2018-11-14

posted @ 2018-11-14 13:56  crackedlove  阅读(1182)  评论(1编辑  收藏  举报