JavaScript中对象的深拷贝来说一直都算比较恶心 毕竟没有什么api能直接全拷贝了 得自己便利写  最近在项目中需要深拷贝 自己简单封了个方法

话不多说 直接上码

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <meta name="viewport" content="width=device-width, initial-scale=1.0">

     <meta http-equiv="X-UA-Compatible" content="ie=edge">

     <title>Document</title>

 </head>

 <body>

     <script>

    function deepCopy(arr_obj){

        //constructor 属性返回对创建此对象的数组函数的引用。

        let obj_arr = arr_obj.constructor === Array ? [] : {};

         for(let key in arr_obj){

             //Object.prototype.toString.call()类型判断

             //Object.prototype.toString.call(obj_arr) 返回 [object Object] 或者 [object Array]

             if(Object.prototype.toString.call(arr_obj[key]) === '[object Object]'){

                 obj_arr[key] = deepCopy(arr_obj[key]);

             }else{

                 if(Object.prototype.toString.call(arr_obj[key]) === '[object Array]'){

                     //console.log(arr_obj[key]);

                     arr_obj[key].forEach((item,index)=>{

                         if(Object.prototype.toString.call(item) === '[object Object]'){

                             obj_arr[key][index] = deepCopy(item);

                         }else{

                             obj_arr[key] = [];

                             obj_arr[key][index] = item;

                         }

                     })

                 }else{

                     obj_arr[key] = arr_obj[key];

                 }

             }

         }

         return obj_arr

    }

    let objA = {

        a:123,

        b:['a','c',{'a':['a','b',['c','d',{e:'c'}]]}],

        c:'yyyy'

    }

    let objB = deepCopy(objA);

    objA.a = 456

    objA.b.push('yyyy');

    console.log(objA,objB);

     </script>

 </body>

 </html>

这个方法目前为止能拷贝的有 对象的value有数组 数组里面有对象 数组里面有数组 还有一些嵌套之类的 在复杂的数据结构没测过 不过这种也基本够用了

我改了objA.a 和objA.b.push('yyyy');

和深拷贝完成的objB做对比如下：

拷贝成功

JavaScript递归简单实现个对象深拷贝的更多相关文章

  1. JavaScript：利用递归实现对象深拷贝

    先来普及一下深拷贝和浅拷贝的区别浅拷贝:就是简单的复制,用等号即可完成 let a = {a: 1} let b = a 这就完成了一个浅拷贝但是当修改对象b的时候,我们发现对象a的值也被改变了 b. ...

  2. JavaScript递归实现对象深拷贝

    let personOne = { name:"张三", age:18, sex:"male", children:{ first:{ name:"z ...

  3. javascript对象深拷贝，浅拷贝 ，支持数组

    javascript对象深拷贝,浅拷贝 ,支持数组 经常看到讨论c#深拷贝,浅拷贝的博客,最近js写的比较多, 所以也来玩玩js的对象拷贝. 下面是维基百科对深浅拷贝的解释: 浅拷贝 One meth ...

  4. 简单的 JSON 对象进行深拷贝最简单的方法

    var json = { a: 123, b: '456' }; var json2 = JSON.parse(JSON.stringify(json)); 只需要先使用 JSON.stringify ...

  5. 【原创教程】JavaScript详解之语法和对象

    JavaScript的好的想法:函数.弱类型.动态对象和一个富有表现力的对象字面量表示法. JavaScript的坏的想法:基于全局变量的编程模型.   好了,不管他是好的还是坏的,都是我的最爱,下面 ...

  6. c#用反射原理递归遍历复杂实体对象

    之前在网上看到的都是遍历那种比较简单的实体对象,但是如果有实体嵌套,甚至是包含有List<XXInfo>这种属性的时候就没有办法处理了.通过递归遍历的方式可以完成对复杂实体对象的所有属性的 ...

  7. [C#]对象深拷贝

    关键代码: /// <summary> /// 对象深拷贝 /// </summary> /// <typeparam name="T">泛型& ...

  8. javascript事件：获取事件对象getEvent函数

    在javascript开发中我们会经常获取页面中的事件对象,然后来处理这些事件,例如下面的getEvent函数就是获取javascript下的页面事件对象. function getEvent(eve ...

  9. Javascript学习6 - 类、对象、继承

    原文:Javascript学习6 - 类.对象.继承 Javasciprt并不像C++一样支持真正的类,也不是用class关键字来定义类.Javascript定义类也是使用function关键字来完成 ...

随机推荐

  1. （水题）洛谷 - P1478 - 陶陶摘苹果（升级版）

    https://www.luogu.org/problemnew/show/P1478 没啥好说的…… 居然还漏写一个等于号WA了一发. #include<bits/stdc++.h> u ...

  2. Codeforces 快速竞技#4

    快速竞技#4 A–Duff and Meat588A = =这题不知道怎么写题解了.. 直接上code---. #include<bits/stdc++.h> #include<st ...

  3. LIS LCS LCIS （主要过一遍，重在做题）

    只详细讲解LCS和LCIS,别的不讲-做题优先. 菜鸟能力有限写不了题解,可以留评论,我给你找博客. 先得理解最长上升子序列吧,那个HDOJ拦截导弹系列可以做一下,然后用o(n)log(n)的在做一遍 ...

  4. 如何使用webstorm去操作git

    0. 前言 在上一篇文章中,讲述了使用webstorm去调试node程序,最近研究了一下如何使用webstorm去操作git. 对于git的使用,大家的使用方式均有不同,最王道的方式非命令行莫属,基于 ...

  5. JDK由浅到深的理解

    一.JDK的安装 二.JDK安装后目录下的文件夹的用处 bin:编译器(javac.exe); db:jdk从1.6之后内置Derby数据库,它是一个纯用Java实现的内存数据库,Apache的开源项 ...

  6. mysql查询所有表名

    mysql使用sql查询表名的两种方法: 1.show tables; 2.SELECT TABLE_NAME,TABLE_ROWS FROM INFORMATION_SCHEMA.TABLES WH ...

  7. 维骨力Glucosamine的最关键的几点...

    1.每日劑量應為多少?長期服用安全嗎? 由於葡萄糖胺(Glucosamine)和軟骨素(Chondroitin)原來就存在於人體,是人體每天會生產製造的必需營養素,因此,一般認為服用此類產品的安全性相 ...

  8. JSP九大内置对象的作用和用法总结【转】

    JSP九大内置对象的作用和用法总结?     JSP中一共预先定义了9个这样的对象,分别为:request.response.session.application.out.pagecontext.c ...

  9. php使用json_decode返回NULL

    php5.2以后自带json_decode函数,但是对json文本串的格式要求非常严格. 很可能使用该函数得到的返回值是NULL 可以使用使用json_last_error()函数获取到的返回值来帮助 ...

  10. DataTable数据导入DataBase

    EXcel---->DataTable--->DataBase /// <summary> /// Excel数据-->DataTable导入DataBase /// & ...