JavaScript递归简单实现个对象深拷贝
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递归简单实现个对象深拷贝的更多相关文章
- JavaScript:利用递归实现对象深拷贝
先来普及一下深拷贝和浅拷贝的区别浅拷贝:就是简单的复制,用等号即可完成 let a = {a: 1} let b = a 这就完成了一个浅拷贝但是当修改对象b的时候,我们发现对象a的值也被改变了 b. ...
- JavaScript递归实现对象深拷贝
let personOne = { name:"张三", age:18, sex:"male", children:{ first:{ name:"z ...
- javascript对象深拷贝,浅拷贝 ,支持数组
javascript对象深拷贝,浅拷贝 ,支持数组 经常看到讨论c#深拷贝,浅拷贝的博客,最近js写的比较多, 所以也来玩玩js的对象拷贝. 下面是维基百科对深浅拷贝的解释: 浅拷贝 One meth ...
- 简单的 JSON 对象进行深拷贝最简单的方法
var json = { a: 123, b: '456' }; var json2 = JSON.parse(JSON.stringify(json)); 只需要先使用 JSON.stringify ...
- 【原创教程】JavaScript详解之语法和对象
JavaScript的好的想法:函数.弱类型.动态对象和一个富有表现力的对象字面量表示法. JavaScript的坏的想法:基于全局变量的编程模型. 好了,不管他是好的还是坏的,都是我的最爱,下面 ...
- c#用反射原理递归遍历复杂实体对象
之前在网上看到的都是遍历那种比较简单的实体对象,但是如果有实体嵌套,甚至是包含有List<XXInfo>这种属性的时候就没有办法处理了.通过递归遍历的方式可以完成对复杂实体对象的所有属性的 ...
- [C#]对象深拷贝
关键代码: /// <summary> /// 对象深拷贝 /// </summary> /// <typeparam name="T">泛型& ...
- javascript事件:获取事件对象getEvent函数
在javascript开发中我们会经常获取页面中的事件对象,然后来处理这些事件,例如下面的getEvent函数就是获取javascript下的页面事件对象. function getEvent(eve ...
- Javascript学习6 - 类、对象、继承
原文:Javascript学习6 - 类.对象.继承 Javasciprt并不像C++一样支持真正的类,也不是用class关键字来定义类.Javascript定义类也是使用function关键字来完成 ...
随机推荐
- PTA【复数相乘】
队友在比赛时A掉的.吊吊吊!!! 主要考虑这些情况吧||| 案例: /* 3i i -3 i -1-i 1+i i 1 -1-i -1-i */ -3 -3i -2i i 2i #include &l ...
- php,c# hamsha1
#!/usr/bin/php <?php print strtoupper(hash_hmac("sha256", "message", "ke ...
- oracle 10g standby 设置
##########sample alter system set log_archive_dest_1 = 'LOCATION=USE_DB_RECOVERY_FILE_DEST' scope=bo ...
- 合理设置apache的连接数及进程工作方式
网站在线人数增多,访问时很慢.初步认为是服务器资源不足了,但经反复测试,一旦连接上,不断点击同一个页面上不同的链接,都能迅速打开,这种现象就是说明apache最大连接数已经满了,新的访客只能排队等待有 ...
- Bootstrap中的datetimepicker浅谈
从古至今,人们都习惯用某个时间来标记某个事件的发生.我们在写管理后台的时候,重中之中也是这个时间的设置.在问题出现的时候,我们是查看日志的时候,就可以根据这个时间段来查找这个问题出现点. 在使用时间控 ...
- 在input标签里只能输入数字
<input type='text' onkeyup="(this.v=function(){this.value=this.value.replace(/[^0-9-]+/,''); ...
- Lambda表达式。
函数式编程思想: 面向对象思想:做一件事,先找能解决这件事的对象,然后调用该对象相应方法. 面向过程思想:只要能获取到结果,怎么做的不重要,重视结果,不重视过程. 冗余的代码: public stat ...
- AJPFX循环结构整理资料
Java语言基础(循环结构概述和for语句的格式及其使用)* A:循环结构的分类 * for,while,do...while * B:循环结构for语句的格式:* ...
- canvas防画图工具
<style> body { background: black; text-align: center; } #cans { background: white; } < ...
- 使用vbScript 链接SQLserver数据库和基础操作
使用vbs链接SQLserver数据库 数据库的创建.设计使用 management studio完成 1.本地链接数据库 set oCon = server.createObject("a ...