数组一维深拷贝:slice、concat、Array.from

对象一维深拷贝:Object.assign

一、利用扩展运算符...对数组中嵌套对象进行深拷贝

var arr=[{a:1,b:2},{c:1,d:2}];
var arr2=[]; arr.forEach(item=>{
var {...obj}=item;
arr2.push(obj);
})
arr2[1].d=7 console.log(arr,arr2)

二、利用lodash库的cloneDeep方法

var arr=[{a:1,b:2},{c:1,d:2}];
var arr2=_.cloneDeep(arr) arr2[1].d=7;
console.log(arr,arr2)

三、JSON.parse(JSON.stringify(objectToClone)) #这种方法能解决绝大部分业务

var arr=[{a:1,b:2},{c:1,d:2}];
var arr2=JSON.parse(JSON.stringify(arr)); arr2[1].d=7;
console.log(arr,arr2)

注:第一这种方法要求对象中的属性值不能是函数、undefined以及symbol值,第二无法拷贝对象原型链上的属性和方法

四、通过递归自定义函数实现深拷贝

function deepCopy (obj) {
// 创建一个新对象
let result = {}
temp = null
key = null
let keys = Object.keys(obj)
keys.map((item, index) => {
key = item
temp = obj[key]
// 如果字段的值也是一个对象则递归操作
if (temp && typeof temp === 'object') {
result[key] = deepCopy(temp)
} else {
result[key] = temp
} })
return result
}
let obj1 = {
x: {
a: 1
},
y: undefined,
z: function test (c, d) {
return c+d
},
u: Symbol('test')
}
let obj2 = deepCopy(obj1)
obj2.x.a = 3
console.log(obj1)
console.log(obj2) 结果:
{ x: { a: 1 },
y: undefined,
z: [Function: test],
u: Symbol(test) }
{ x: { a: 3 },
y: undefined,
z: [Function: test],
u: Symbol(test) }
 

// 未完待续

js对象深拷贝的更多相关文章

  1. js对象深拷贝、浅拷贝

    浅拷贝1 //浅拷贝1 let obj01 = { name: 'Lily', age: '20', time: ['13', '15'], person: { name: 'Henry', age: ...

  2. js对象深拷贝与浅拷贝

    浅拷贝 把a赋值给b,a与b指向相同的内存,修改b值,a也会跟着改变. var a = "aa"; var b = a; b = "bb"; 这个时候a也变成了 ...

  3. 原生js 对象深拷贝

    经常需要copy一个对象,又怕拷贝有问题,那下面这段就很方便啦,不用担心copy只是一个引用了. /** @ values 需要copy的变量 */ function deepClone(values ...

  4. js 对象深拷贝

    /* *p需要拷贝的对象 * */ var deepCopy=function(p, c) { var c = c || {}; for (var i in p) { if (typeof p[i] ...

  5. 一篇文章彻底说清JS的深拷贝/浅拷贝

    一篇文章彻底说清JS的深拷贝and浅拷贝 这篇文章的受众 第一类,业务需要,急需知道如何深拷贝JS对象的开发者. 第二类,希望扎实JS基础,将来好去面试官前秀操作的好学者. 写给第一类读者 你只需要一 ...

  6. js对象进行浅复制,深拷贝的方法

    js对象浅拷贝和深拷贝详解   本文为大家分享了JavaScript对象的浅拷贝和深拷贝代码,供大家参考,具体内容如下 1.浅拷贝 拷贝就是把父对像的属性,全部拷贝给子对象. 下面这个函数,就是在做拷 ...

  7. js对象浅拷贝和深拷贝详解

    js对象浅拷贝和深拷贝详解 作者:i10630226 字体:[增加 减小] 类型:转载 时间:2016-09-05我要评论 这篇文章主要为大家详细介绍了JavaScript对象的浅拷贝和深拷贝代码,具 ...

  8. js对象的直接赋值、浅拷贝与深拷贝

    最近Vue项目中写到一个业务,就是需要把对话框的表单中的数据,每次点击提交之后,就存进一个el-table表格中,待多次需要的表单数据都提交进表格之后,再将这个表格提交,实现多个表单数据的同时提交,期 ...

  9. 也来玩玩 javascript对象深拷贝,浅拷贝

    经常看到讨论c#深拷贝,浅拷贝的博客,最近js写的比较多, 所以也来玩玩js的对象拷贝. 下面是维基百科对深浅拷贝的解释: 浅拷贝 One method of copying an object is ...

随机推荐

  1. 关于jQuery.ajax()的jsonp碰上post详解

    前言 以前一直以为当$.ajax()的 dataType设置为jsonp时,其method(请求方法)无论怎么设置,都会变成get,直到前两天遇到了一个坑. 下面来一起看看详细的介绍: 关于跨域请求与 ...

  2. 算法入门及其C++实现

    https://github.com/yuwei67/Play-with-Algorithms (nlogn)为最优排序算法 选择排序 整个数组中,先选出最小元素的位置,将该位置与当前的第一位交换:然 ...

  3. 二进制手动部署kubernetes 1.10.10

    转载于:https://www.jevic.cn/2018/09/23/kuberentes-1.10.10/?tdsourcetag=s_pcqq_aiomsg#heapster 通读一遍在实际操作 ...

  4. 基于 Django 2.0.4 的 djcelery 配置

    Django Celery 配置实践 所需环境 python 3.5.2 rabbitmq 安装所需的包 pip install -r requirements.txt QuickStart 创建Dj ...

  5. js的模块化

    模块化的好处 以前我们平常写js,需要引用大量大js文件,还得注意先后顺序,因为是一层一层依赖的关系.很是麻烦,现在有了模块化,我们只需要知道,我们要实现这个功能需要哪一个js文件就ok,其他的不需要 ...

  6. .NET MVC中的防CSRF攻击

    一.CSRF是什么? CSRF(Cross-site request forgery),中文名称:跨站请求伪造,也被称为:one click attack/session riding,缩写为:CSR ...

  7. Calendar add 方法 和set方法

    SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss"); Calendar c = Calendar. ...

  8. Neural Networks and Deep Learning 课程笔记(第四周)深层神经网络(Deep Neural Networks)

    1. 深层神经网络(Deep L-layer neural network ) 2. 前向传播和反向传播(Forward and backward propagation) 3. 总结 4. 深层网络 ...

  9. 正方体旋转demo

    接着上一篇博客的内容顺藤摸瓜往下想,既然stage有景深这个概念,可以表达3D场景,那么这个stage就可以呈现立体几何咯,于是自己写了个Cubic Demo 一个正方体有6个面,我们把一个正方体平铺 ...

  10. python中enumerate()的用法

    enumerate()函数用于遍历一个可遍历的数据对象(如列表.元组或字符串等)的索引和其对应的元素,一般用于for循环中. enumerate(sequence, [start=0]) sequen ...