• JS实现深拷贝


    一、赋值、浅拷贝与深拷贝的区别

    二、深拷贝的方法

    1.JSON转换

    var targetObj = JSON.parse(JSON.stringify(copyObj))
    let arr4 = JSON.parse(JSON.stringify(arr))
    

    缺点:

    (1)如果对象里有函数,函数无法被拷贝下来

    (2)无法拷贝copyObj对象原型链上的属性和方法

    (3)当数据的层次很深,会栈溢出

    2.普通递归函数

    function deepCopy( source ) {
    if (!isObject(source)) return source; //如果不是对象的话直接返回
        let target = Array.isArray( source ) ? [] : {} //数组兼容
        for ( var k in source ) {
        	if (source.hasOwnProperty(k)) {
        		if ( typeof source[ k ] === 'object' ) {
                	target[ k ] = deepCopy( source[ k ] )
            	} else {
                	target[ k ] = source[ k ]
            	}
        	}
        }
        return target
    }
    
    function isObject(obj) {
        return typeof obj === 'object' && obj !== null
    }
    
    

    缺点:

    (1)无法保持引用

    (2)当数据的层次很深,会栈溢出

    3.防栈溢出函数

    function cloneLoop(x) {
        const root = {};
    
        // 栈
        const loopList = [
            {
                parent: root,
                key: undefined,
                data: x,
            }
        ];
    
        while(loopList.length) {
            // 深度优先
            const node = loopList.pop();
            const parent = node.parent;
            const key = node.key;
            const data = node.data;
    
            // 初始化赋值目标,key为undefined则拷贝到父元素,否则拷贝到子元素
            let res = parent;
            if (typeof key !== 'undefined') {
                res = parent[key] = {};
            }
    
            for(let k in data) {
                if (data.hasOwnProperty(k)) {
                    if (typeof data[k] === 'object') {
                        // 下一次循环
                        loopList.push({
                            parent: res,
                            key: k,
                            data: data[k],
                        });
                    } else {
                        res[k] = data[k];
                    }
                }
            }
        }
    
        return root;
    }
    

    优点:

    (1)不会栈溢出

    (2)支持很多层级的数据

     function copyObject(orig) {
        var copy = Object.create(Object.getPrototypeOf(orig));
        copyOwnPropertiesFrom(copy, orig);
        return copy;
      }
    
    
      function copyOwnPropertiesFrom(target, source) {
        Object
        .getOwnPropertyNames(source)
        .forEach(function (propKey) {
          var desc = Object.getOwnPropertyDescriptor(source, propKey);
          Object.defineProperty(target, propKey, desc);
        });
        return target;
      }
    
      var obj = {
        name: 'Jack',
        age: '32',
        job: 'developer'
      };
    
      var obj2 = copyObject(obj);
      console.log(obj2);
      obj.age = 39;
      obj.name = 'Tom';
      console.log(obj);
      console.log(obj2);
    
    
    
    
  • 相关阅读:
    windows 开发 数据模版 Itemtemp
    windows 8 获取用户账号信息
    从客户端中检测到有潜在危险的 Request.Form 值解决方法
    asp.net异步处理
    知道web.config 中的 urlMappings怎么用?
    .net c#日期时间函数大全
    设计模式学习心得之工厂类模式(一)简单工厂模式
    远程网页内容抓取
    TreeView数据绑定的方法(1)
    URLRewriter.dll asp.net伪静态
  • 原文地址:https://www.cnblogs.com/dobeco/p/11295316.html
Copyright © 2020-2023  润新知