JS对象的深度克隆方法示例
js中创建的对象指向内存,所以在开发过程中,往往修改了一个对象的属性,会影响另外一个对象。
尤其是在angular框架中,dom是由数据驱动的,在增删改查对象的操作中,对象属性的继承关系是很让人头痛的!
我之前遇到的问题就是,在编辑页面,操作了对象数据,影响到了展示数据的展现!
我整理了两种深度克隆对象的方法,供大家参考!
首先var 一个假数据
var schedule = {"status":21,"msg":"ok","data":[{"name":"lemon","age":21,"contactList":{"phone":[152,153,154],"email":5295}},{"name":"lara","age":22,"contact":{"phone":152,"email":5295}}]}
方法1:
遍历自身,判断当前对象是obj还是list,克隆出新对象
function deepClone(obj) { var o,i,j,k; if(typeof(obj)!="object" || obj===null)return obj; if(obj instanceof(Array)) { o=[]; i=0;j=obj.length; for(;i<j;i++) { if(typeof(obj[i])=="object" && obj[i]!=null) { o[i]=arguments.callee(obj[i]); } else { o[i]=obj[i]; } } } else { o={}; for(i in obj) { if(typeof(obj[i])=="object" && obj[i]!=null) { o[i]=arguments.callee(obj[i]); } else { o[i]=obj[i]; } } } return o; } var scheduleClone = deepClone(schedule) scheduleClone.data[0].contactList.phone[0] = 99999999999 console.log('方法1 深度克隆') console.log(scheduleClone) console.log(JSON.stringify(schedule)) console.log(JSON.stringify(scheduleClone))
方法2:
用js原生的json序列化的方式,简单粗暴!
var scheduleClone2 = JSON.parse(JSON.stringify(schedule)); console.log('方法2 深度克隆') console.log(scheduleClone2) scheduleClone2.data[0].contactList.phone[0] = 8888888 console.log(JSON.stringify(schedule)) console.log(JSON.stringify(scheduleClone2))
(资源库 www.zyku.net)
您可能感兴趣的文章
- 05-31Javascript创建类和对象详解
- 05-28PHP面向对象 封装与继承
- 01-17万兴神剪手-万兴神剪手应用软件功能介
- 01-08vivox70Pro如何进行录屏
- 02-18mongoDB 实现主从读写分离实现的实例
- 01-11一键手机录屏-一键手机录屏应用软件功
- 10-20苹果13查看激活时间方法分享
- 01-12音乐相册-音乐相册应用软件功能介绍
- 01-31华为手机关屏显示通知设置方法
- 11-25华为matepad11如何开启智慧多窗应用栏
- 07-05Linux ytalk命令
- 09-14苹果手机共享音频适用教程一览
- 09-19网易云音乐怎么关闭云村入口
- 02-28苹果手机桌面添加日历小组件教程
- 01-12柳州市中医医院-柳州市中医医院应用软
- 04-26火车头采集器常用正则表达式
- 01-12FluffyPhoto app-FluffyPhoto app应用
- 04-02红米k40微距拍摄操作方法
- 03-02荣耀畅玩20设置返回键方法
- 03-18荣耀50se恢复出厂设置方法
最近更新
阅读排行
猜你喜欢
- 01-17小七影视-小七影视应用软件功能介绍
- 02-05小米11启用夜景模式拍照方法
- 01-08乐享礼县-乐享礼县应用软件功能介绍
- 04-24华为nova8关闭锁屏功能设置方法
- 10-12华为nova9pro怎样添加门禁卡
- 09-26华为手机如何连接热点
- 09-23魅族Flyme9.2更新了什么
- 03-22华为matex2开启悬浮球功能教程
- 04-02oppofindx3开启免打扰教程
- 02-14华为nove7隐藏屏幕刘海设置教程