JavaScript递归简单实现个对象深拷贝
JavaScript中对象的深拷贝来说一直都算比较恶心 毕竟没有什么api能直接全拷贝了 得自己便利写 最近在项目中需要深拷贝 自己简单封了个方法
话不多说 直接上码
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <meta http-equiv="X-UA-Compatible" content="ie=edge"> 7 <title>Document</title> 8 </head> 9 <body> 10 <script> 11 function deepCopy(arr_obj){ 12 //constructor 属性返回对创建此对象的数组函数的引用。 13 let obj_arr = arr_obj.constructor === Array ? [] : {}; 14 for(let key in arr_obj){ 15 //Object.prototype.toString.call()类型判断 16 //Object.prototype.toString.call(obj_arr) 返回 [object Object] 或者 [object Array] 17 if(Object.prototype.toString.call(arr_obj[key]) === '[object Object]'){ 18 obj_arr[key] = deepCopy(arr_obj[key]); 19 }else{ 20 21 if(Object.prototype.toString.call(arr_obj[key]) === '[object Array]'){ 22 //console.log(arr_obj[key]); 23 arr_obj[key].forEach((item,index)=>{ 24 if(Object.prototype.toString.call(item) === '[object Object]'){ 25 obj_arr[key][index] = deepCopy(item); 26 }else{ 27 obj_arr[key] = []; 28 obj_arr[key][index] = item; 29 } 30 }) 31 }else{ 32 obj_arr[key] = arr_obj[key]; 33 } 34 } 35 } 36 37 return obj_arr 38 } 39 let objA = { 40 a:123, 41 b:['a','c',{'a':['a','b',['c','d',{e:'c'}]]}], 42 c:'yyyy' 43 } 44 let objB = deepCopy(objA); 45 objA.a = 456 46 objA.b.push('yyyy'); 47 console.log(objA,objB); 48 49 </script> 50 </body> 51 </html>
这个方法目前为止能拷贝的有 对象的value有数组 数组里面有对象 数组里面有数组 还有一些嵌套之类的 在复杂的数据结构没测过 不过这种也基本够用了
我改了objA.a 和objA.b.push('yyyy');
和深拷贝完成的objB做对比如下：
拷贝成功
