• 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

  • 相关阅读:
    ctags and vim
    [转]bash快捷键
    util-linux编译unknown architecture 'BSD_LABELSECTOR' undeclared错误
    HTML5安全攻防详析之八:Web Socket攻击
    HTML5安全攻防详析之七:新标签攻击
    HTML5安全风险详析之六:API攻击
    HTML5安全风险详析之五:劫持攻击
    HTML5安全风险详析之四:Web Worker攻击
    HTML5安全风险详析之二:Web Storage攻击
    HTML5安全风险详析之一:CORS攻击
  • 原文地址:https://www.cnblogs.com/crackedlove/p/9957605.html
Copyright © 2020-2023  润新知