js之-实现深浅拷贝的各种方法

2022-12-30 0 964

在js中,正则表达式分三种: ‘基本上正则表达式’ 和 ‘提及正则表达式’

‘基本上类别统计数据’ 存有于 栈缓存 中,提及正则表达式’ 的特性存有于 栈缓存中,值存有与 堆缓存中,透过操作符来对准相关联值

因此,厚薄复本主要再次出现在提及正则表达式中

如下表所示图,是浅复本,复本出的表达式 copyArray,而已复本操作符,对准的却是同一堆缓存中的统计数据,因此,当中两个值发生改变,除此之外两个值适当发生改变

js之-实现深浅拷贝的各种方法

如下表所示图,是深复本,复本出的值,在堆缓存中除此之外开拓内部空间,储存缓存统计数据,透过操作符对准。当发生改变新复本的值时,李骞不能被发生改变。

js之-实现深浅拷贝的各种方法

JSON.prase( JSON.string() )

var arr = [1,2,3,4,5]; var copyArray = JSON.parse( JSON.stringify(arr) ); copyArray[0] = 0; console.log( arr ) // [1, 2, 3, 4, 5] console.log( copyArray ) // [0, 2, 3, 4, 5]

但是 JSON.parse来转译深复本,真的就没问题吗?

先多层嵌套,试一下是否还能深复本

var arr = [1, [2,3] , {name: 1} ]; var copyArray = JSON.parse( JSON.stringify(arr) ); copyArray[1][1] = 0; console.log( arr ); // [1, [2,3] , {name: 1} ] console.log( copyArray ) ; // [1, [2,0], {name: “1”} ]

从上面代码可以看出,多层嵌套时,也能深复本。当统计数据里含有function是否可以依然深复本?

var obj = { name: “1” , f: function(){ alert(1) } }; var copyObj = JSON.parse( JSON.stringify(obj) );console.log( obj ); // {name: “1”, f: ƒ} console.log( copyObj ) ; // {name: “1”}

从上面代码可以总结出:

JSON.parse进行深复本时,能够满足部分统计数据需求,能够进行多层次统计数据的复本,但是会忽略function,undefined,symbo,因此在使用时,要注意统计数据结构

循环递归深复本

function copy( obj ){ // 定义常量 const newCopy = obj.constructor === Array ? [] : {}; // 循环统计数据 for( var key in obj ){ // 判断是否有这个表达式 if( obj.hasOwnProperty(key) ){ // 判断当前特性是否有值,并且属不属于Array和object (typeOf,不管array却是object都返回object) if( !!obj[key] && typeof obj[key] === object ){ // 属于Array或者object,并且有值,调用自身,重新循环newCopy[key] = copy(obj[key]); }else { // 不属于或者没值,直接赋值 newCopy[key] = obj[key] } } } // return出深复本统计数据 returnnewCopy; };// 调用一下 var demoObj = { name: { val:“1”, val2:“2”, val3:“3” } , arr: [1,2,3,4], f: function(){ alert(2) } } var cloneDemoObj = copy(demoObj); cloneDemoObj.f = function(){ alert(6); } demoObj.f();// 弹出2 cloneDemoObj.f(); // 弹出6 cloneDemoObj.arr[0] = 6; cloneDemoObj.name.val = “6”; console.log( demoObj ); // {name: {val:”1″,val2:”2″,val3:”3″} , arr: [1,2,2,4], f:f{} } console.log( cloneDemoObj);// {name: {val:”6″,val2:”2″,val3:”3″} , arr: [6,2,2,4], f:f{} }

concat() , slice(),都不发生改变原数组,新建统计数据,经测试,只能深复本首层统计数据

var arr = [1,2,3]; var copyArr = arr.concat(); copyArr[0] = 2; console.log( arr );// [1, 2, 3] console.log( copyArr ); // [2, 2, 3] var arr1 = [1, [1,1,1], 2]; varcopyArr1 = arr1.concat(); copyArr1[0] = 0; copyArr1[1][0] = 0; //深层次统计数据没有深复本,被发生改变,如下表所示 console.log( arr1 ); // [1, [0,1,1], 2]; console.log( copyArr1); // [0, [0,1,1], 2];
js之-实现深浅拷贝的各种方法

相关文章

发表评论
暂无评论
官方客服团队

为您解决烦忧 - 24小时在线 专业服务