分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 软件开发

Js深度克隆解析

发布时间:2023-09-06 02:00责任编辑:蔡小小关键词:暂无标签

Js克隆(clone),就是数据拷贝,包括基础类型的数据和引用类型的数据,而深度克隆(deepClone)就是针对引用类型,如数组和对象。

两种拷贝的区别在于:浅拷贝时,拷贝出的对象指向原对象的地址,当其值发生改变时,原对象的值也发生改变;

               深度拷贝,拷贝出的对象指向一个新的地址,当其值发生改变时,原对象的值不受影响。

下面列出深度拷贝的代码及其详细注释:

var obj = {//待拷贝的对象 ??name:"abc", ??age:"123", ??card:[‘visa‘,‘master‘], ??wife:{ ??name:"bcd", ??son:{ ????name:"aaa" ??} ??}, ??a:function(){} ?}function deepclone(origin , target){ ?var target = target || {}, ?????tostr = Object.prototype.toString,//使用Object.prototype.toString.call方法进行对象和数组的区分,所以先将其进行存储以便使用 ?????arr = ‘[object Array]‘; ?for(var prop in origin){ ?????if(origin.hasOwnProperty(prop)){//防止拷贝的对象从原对象的原型上取值 ?????????if(origin[prop] !== "null" && typeof(origin[prop]) == ‘object‘){//当遍历到的数据为对象或数组时调用Object.prototype.toString.call方法 ?????????????if(tostr.call(origin[prop]) == arr){//遍历到数组,创建数组 ?????????????????target[prop] = []; ?????????????}else{//遍历到对象,创建对象 ????????????????target[prop] = {}; ?????????????} ??????????????????????????deepclone(origin[prop] , target[prop]);//对遍历到的数组和对象再次深度克隆 ????????}else{ ????????????target[prop] = origin[prop];//当遍历到的数据为原始值时,直接进行赋值 ????????} ????} } ????????return target; }var target;console.log(deepclone(obj,target));//实现target深度拷贝obj

Js深度克隆解析

原文地址:https://www.cnblogs.com/77days/p/9196243.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved