zoukankan      html  css  js  c++  java
  • JS实现对对象的深拷贝

    手动遍历对象拷贝

    /**
     * 深拷贝
     * @param {*} obj 拷贝对象(object or array)
     * @param {*} cache 缓存数组
     */
    function deepCopy (obj, cache = []) {
      // typeof [] => 'object'
      // typeof {} => 'object'
      if (obj === null || typeof obj !== 'object') {
        return obj
      }
      // 如果传入的对象与缓存的相等, 则递归结束, 这样防止循环
      /**
       * 类似下面这种
       * var a = {b:1}
       * a.c = a
       * 资料: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Errors/Cyclic_object_value
       */
      const hit = cache.filter(c => c.original === obj)[0]
      if (hit) {
        return hit.copy
      }
    
      const copy = Array.isArray(obj) ?  [] :   {}
      // 将copy首先放入cache, 因为我们需要在递归deepCopy的时候引用它
      cache.push({
        original: obj,
        copy
      })
      Object.keys(obj).forEach(key => {
        copy[key] = deepCopy(obj[key], cache)
      })
    
      return copy
    }
    

    使用JSON模块

    根据不包含引用对象的普通数组深拷贝得到启发,不拷贝引用对象,拷贝一个字符串会新辟一个新的存储地址,这样就切断了引用对象的指针联系。

    测试例子:

    var test={
        a:"ss",
        b:"dd",
        c:[
            {dd:"css",ee:"cdd"},
            {mm:"ff",nn:"ee"}
        ]
    };
    var test1 = JSON.parse(JSON.stringify(test));//拷贝数组,注意这行的拷贝方法
    console.log(test);
    console.log(test1);
    test1.c[0].dd="change"; //改变test1的c属性对象的d属性
    console.log(test);  //不影响test
    console.log(test1);
    

    JSON.parse(),JSON.stringify()兼容性问题
    可以通过为IE7以及IE7以下版本的IE浏览器引入json2.js,使用json2.js来解决JSON的兼容性问题

    <!--[if lt IE 7]>
    <script src="具体放路径/json2.js"></script> 
    <![endif]-->
    

    json2.js的github地址为:https://github.com/douglascrockford/JSON-js

  • 相关阅读:
    2017年第一篇博客--关于集成友盟和微信支付等遇到的坑
    【转】ArcGIS Server10.1安装常见问题及解决方案
    【转】C# GDAL 配置
    【转】Silverlight无法添加服务引用
    arcgis for js/flex/sl 该选哪一个?
    webgis开发-开始向JS转向
    形象解释C#、Net、Asp.net
    怎么区分odd和even
    Linux入门
    html网页访问WebAPI中的方法遇到的问题
  • 原文地址:https://www.cnblogs.com/wbyixx/p/11969980.html
Copyright © 2011-2022 走看看