深拷贝和浅拷贝的方法有哪些？ |
您所在的位置：网站首页 › app推广的常用方法有哪些呢 › 深拷贝和浅拷贝的方法有哪些？ |
这是我参与「4月日新计划更文活动」的第26天。 今天跟大家聊一下深拷贝和浅拷贝之间的区别，并且演示一下如何实现一个深拷贝。 我们都知道，在使用前端实现功能的时候，拷贝数据是经常使用到的。 那今天我们来讨论一下浅拷贝和深拷贝常用的一些方法。 浅拷贝目前比较常用的一些浅拷贝的方法有下面几个。 方法一：Object.assign。就是将源对象的属性复制到目标对象中，并返回目标对象。 例子如下： const a = { name: '1111' }; const b = { age: 20 } const c = Object.assign(a, b) console.log(a, c); console.log(a === c);可以看到a的原始值跟b的值合并，生成了c。同时a的值也变成了合并之后的值。 方法二： 点点点远算符 const a = { name: '1111' }; const b = { age: 20 } const c = { ...a, ...b }; console.log(c);C输出的结果是：{ name: '1111', age: 20 } 方法三：Array.slice const arr = [ 1, 2, 3, 4, 5 ]; const clone = arr.slice()浅复制一个数组。 方法四：Array.concat通过原数组跟其他数组合并，形成新的数组。 const arr = [ 1, 2, 3, 4, 5 ]; const arr1 = [ 7, 8 ]; const clone = Array.concat(arr, arr1); 方法五：Object.assign将对象展开为一个新的对象，从而达到浅拷贝的目的。 const arr = [ 1, 2, 3, 4, 5 ]; const arr1 = [ 7, 8 ]; const clone = Object.assign(arr, arr1); 深拷贝深拷贝相对于浅拷贝来说，是从对象的拷贝效果的层级来说的。 浅拷贝是只能拷贝单层对象的效果，深拷贝是对于对象的多层对象都能拷贝。而且拷贝之后的新对象与原对象之间互不影响。 但是浅拷贝的对象如果修改的层级比较深，那么两个对象之间就会相互影响。从而达不到数据互相隔离的目的。 以下，是我手写的一个深拷贝的代码。 function deepClone(obj) { if(typeof obj !== 'object' || obj === null){ return obj; } // 兼容日期 if (obj instanceof Date) return new Date(obj); // 兼容正则 if (obj instanceof RegExp) return new RegExp(obj); // 兼容函数 if(obj instanceof Function) return new Function(obj); // 初始值设置为对象 var result = {} // 如果是数组，初始值是空数组 if (obj instanceof Array) { result = [] } for (var key in obj) { // 拷贝自身的属性 if (obj.hasOwnProperty(key)) { result[key] = deepClone(obj[key]); } } return result; }需要特别注意的是：这里考虑到了Date类型、RegExp类型和Function类型的深拷贝。以及普通的对象和数组的深拷贝。 拷贝之后的目标对象，与原对象之间深层次的属性修改，也不会互相影响。 以上，就是我今天对于深拷贝和浅拷贝的方法的理解。 看到掘金上的好文章，如果对你有帮助，顺手点个赞，或者把文章收藏。不用担心找不到了，以后也能经常收到类似好回答，我会持续进行更新。 |
今日新闻 |
点击排行 |
|
推荐新闻 |
图片新闻 |
|
专题文章 |
| CopyRight 2018-2019 实验室设备网 版权所有 win10的实时保护怎么永久关闭 |