JS 手写深拷贝

灰太狼 2022-11-03 15:26 138阅读 0赞

### JS 手写 深拷贝 ###

方法一：

<!DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>Document</title>
    </head>
    
    <body>
        <script>
            var obj1 = { 
                name: "laowang",
                age: 18,
                hobby: ["唱", "跳", "rap"],
                do: function () { 
    
                }
            }
    
            //JSON对象转JSON字符串(函数不能被转换)
            var obj1Str = JSON.stringify(obj1);
            console.log(obj1Str) 
            //{"name":"laowang","age":18,"hobby":["唱","跳","rap"]}
    
            //JSON字符串转JSON对象
            var obj2 = JSON.parse(obj1Str);
            console.log(obj2);
    
            console.log(obj1 === obj2)
            console.log(obj1.hobby === obj2.hobby)
        </script>
    </body>
    
    </html>

方法二：

var obj1 = { 
      name: 'laowang',
      age:18,
      do: function () { 
        console.log('study');
      },
      hobby: ['sing','dance','rap',[123]],
    };
    function checkType(obj) { 
      return Object.prototype.toString.call(obj).slice(8,-1).toLowerCase();
    }
    
    function deepClone(obj) { 
      if (checkType(obj) === 'object'){ 
        var newObj = { };
      } else if (checkType(obj) === 'array') { 
        var newObj = [];
      } else { 
        return obj;
      }
    
      for (var key in obj) { 
         newObj[key] = deepClone(obj[key]);
      }
      return newObj
    }
    
    var obj2 = deepClone(obj1);
    console.log(obj2 === obj1);

发表评论取消回复

表情：

评论列表（有 0 条评论，138人围观）

还没有评论，来说两句吧...

相关阅读

相关 JavaScript中手写深拷贝函数-事件总线

1.手写深拷贝函数 > 前面我们已经学习了对象相互赋值的一些关系，分别包括: > > 引入的赋值：指向同一个对象，相互之间会影响； > 对象的浅拷贝：只是浅

ゝ一世哀愁。/ 2023年09月28日 13:13/ 0 赞/ 70 阅读

相关浅析JS深拷贝

常用的拷贝方案： `JSON.parse(JSON.stringfily())` `Object.assign()` 递归实现 `JSON.parse(

左手的ㄟ右手/ 2023年01月13日 09:35/ 0 赞/ 102 阅读

相关递归手写深拷贝 ===== js数据类型判断

递归手写深拷贝前提： > 深拷贝和浅拷贝是只针对Object和Array这样的引用数据类型的。 1. 堆栈内存具体看另一篇博客数据类型、堆栈存储

偏执的太偏执、/ 2022年12月26日 11:09/ 0 赞/ 92 阅读

相关递归手写深拷贝

前提： > 深拷贝和浅拷贝是只针对Object和Array这样的引用数据类型的。 1. 堆栈内存具体看另一篇博客[数据类型、堆栈存储][Link 1] 2. 浅

￡神魔★判官ぃ/ 2022年12月17日 10:59/ 0 赞/ 161 阅读

相关前端---JS深拷贝

<html> <head> </head> <body> </body> </html>

清疚/ 2022年12月06日 15:16/ 0 赞/ 136 阅读

相关 JS 手写深拷贝

JS 手写深拷贝方法一： <!DOCTYPE html> <html lang="en"> <head> <

灰太狼/ 2022年11月03日 15:26/ 0 赞/ 139 阅读

相关手写浅拷贝深拷贝

递归浅拷贝 ![在这里插入图片描述][watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5Ym

迈不过友情╰/ 2022年09月15日 05:44/ 0 赞/ 216 阅读

相关 js 深拷贝函数

// 定义一个深拷贝函数接收目标target参数 function deepClone(target) { // 定义一个变量

淡淡的烟草味﹌/ 2022年09月08日 04:58/ 0 赞/ 148 阅读

相关手写JS系列-深拷贝

我们知道JS中数据类型分为基本数据类型和引用数据类型，基本数据类型之间的赋值是在内存中重新分配空间且保存着一样的值，而引用类型之间的赋值只是复制引用值，当原来对象中的属性值发生

分手后的思念是犯贱/ 2022年08月29日 00:26/ 0 赞/ 135 阅读

相关 js深拷贝浅拷贝

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <

朱雀/ 2021年08月31日 14:35/ 0 赞/ 434 阅读