手动遍历对象拷贝

/**
* 深拷贝
* @param {*} obj 拷贝对象(object or array)
* @param {*} cache 缓存数组
*/
function deepCopy (obj, cache = []) {
// typeof [] => 'object'
// typeof {} => 'object'
if (obj === null || typeof obj !== 'object') {
return obj
}
// 如果传入的对象与缓存的相等, 则递归结束, 这样防止循环
/**
* 类似下面这种
* var a = {b:1}
* a.c = a
* 资料: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Errors/Cyclic_object_value
*/
const hit = cache.filter(c => c.original === obj)[0]
if (hit) {
return hit.copy
} const copy = Array.isArray(obj) ? [] : {}
// 将copy首先放入cache, 因为我们需要在递归deepCopy的时候引用它
cache.push({
original: obj,
copy
})
Object.keys(obj).forEach(key => {
copy[key] = deepCopy(obj[key], cache)
}) return copy
}

使用JSON模块

根据不包含引用对象的普通数组深拷贝得到启发,不拷贝引用对象,拷贝一个字符串会新辟一个新的存储地址,这样就切断了引用对象的指针联系。

测试例子:

var test={
a:"ss",
b:"dd",
c:[
{dd:"css",ee:"cdd"},
{mm:"ff",nn:"ee"}
]
};
var test1 = JSON.parse(JSON.stringify(test));//拷贝数组,注意这行的拷贝方法
console.log(test);
console.log(test1);
test1.c[0].dd="change"; //改变test1的c属性对象的d属性
console.log(test); //不影响test
console.log(test1);

JSON.parse(),JSON.stringify()兼容性问题

可以通过为IE7以及IE7以下版本的IE浏览器引入json2.js,使用json2.js来解决JSON的兼容性问题

<!--[if lt IE 7]>
<script src="具体放路径/json2.js"></script>
<![endif]-->

json2.js的github地址为:https://github.com/douglascrockford/JSON-js

JS实现对对象的深拷贝的更多相关文章

  1. JS 数组以及对象的深拷贝总结

    javascript 数组以及对象的深拷贝(复制数组或复制对象)的方法 前言 在js中,数组和对象的复制如果使用=号来进行复制,那只是浅拷贝.如下图演示:  如上,arr的修改,会影响arr2的值,这 ...

  2. JS 数组、对象的深拷贝

    博客地址:https://ainyi.com/72 JavaScript 程序中,对于简单的数字.字符串可以通过 = 赋值拷贝 但是对于数组.对象.对象数组的拷贝,就有浅拷贝和深拷贝之分 浅拷贝就是当 ...

  3. js中json对象的深拷贝

    /** * 对象深拷贝 * @param obj */ function deepCopy(obj) { var txt=JSON.stringify(obj); return JSON.parse( ...

  4. JS中有关对象的继承以及实例化、浅拷贝深拷贝的奥秘

    一.属性的归属问题 JS对象中定义的属性和方法如果不是挂在原型链上的方法和属性(直接通过如类似x的方式进行定义)都只是在该对象上,对原型链上的没有影响.对于所有实例共用的方法可直接定义在原型链上这样实 ...

  5. JS中如何进行对象的深拷贝

    在JS中,一般的=号传递的都是对象/数组的引用,并没有真正地拷贝一个对象,那如何进行对象的深度拷贝呢?如果你对此也有疑问,这篇文章或许能够帮助到你 一.对象引用.浅层拷贝与深层拷贝的区别 js的对象引 ...

  6. JS对象复制(深拷贝、浅拷贝)

    如何在 JS 中复制对象 在本文中,我们将从浅拷贝(shallow copy)和深拷贝(deep copy)两个方面,介绍多种 JS 中复制对象的方法. 在开始之前,有一些基础知识值得一提:Javas ...

  7. JS如何进行对象的深克隆(深拷贝)?

    JS中,一般的赋值传递的都是对象/数组的引用,并没有真正的深拷贝一个对象,如何进行对象的深拷贝呢? var a = {name : 'miay'}; var b = a; b.name = 'Jone ...

  8. js对象的深拷贝

    关于对象的深拷贝一直是大家津津乐道一个话题,本骚年通过研究(yuedu)发现还是很easy的. 首推的方法简单有效,JSON.stringfy()和JSON.parse()即可搞定.但是这种简单粗暴的 ...

  9. JS数组和对象的浅拷贝和深拷贝

    共勉~ 在许多编程语言中,传递参数和赋值是通过值的直接复制或者引用复制完成的.在JavaScript中,对于值是直接进行复制还是引用复制在语法上是没有区别的,完全是根据值的类型来决定的. 在JavaS ...

随机推荐

  1. 欧拉降幂 (a^t)%c 模板

    #include<bits/stdc++.h> using namespace std; typedef long long ll; ll a,c,p,mod; ]; ll phi(ll ...

  2. winform datagridview 同步滚动

    //首先添加 Scroll事件//同步滚动 private void dgYY_Scroll(object sender, ScrollEventArgs e) { ) { dgFee.FirstDi ...

  3. Centos6.10-FastDFS-存储器Http配置

    Centos610系列配置 1.准备配置 cd /opt/download/fastdfs-master/confcp http.conf /etc/fdfs/http.confcp mime.typ ...

  4. Windows Server 2016安装.NET Framework 3.5

    1.打开“服务器管理器” 2.点击“添加角色和功能” 3.点击“下一步” 4.点击“下一步” 5.点击“下一步” 6.点击“下一步” 7.勾选“.NET Framework 3.5功能”,点击“下一步 ...

  5. 6_8 树(UVa548)<从中序和后序恢复二叉树>

    你的任务是找出一棵二叉树中最小路径上终端节点(树叶,leaf node)的值.所谓路径乃指从根节点(root)旅行到任一终端节点.路径的值为所经过的节点的值的和(包含根节点及终端节点).而最小路径就是 ...

  6. Python学习(五)—— 集合和字符格式化

    数据类型和变量的总结 字符串 数字 列表 元组 字典 分类 1.可变不可变: 可变(即修改变量值以后id不改变):列表.字典 不可变(即修改变量值以后id改变):字符串.数字.元组 2.访问顺序: 直 ...

  7. 【PAT甲级】1072 Gas Station (30 分)(Dijkstra)

    题意: 输入四个正整数N,M,K,D(N<=1000,M<=10,K<=10000)分别表示房屋个数,加油站个数,路径条数和加油站最远服务距离,接着输入K行每行包括一条路的两条边和距 ...

  8. 支付接口API

    //微信支付SDK https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=11_1

  9. hadoop中block副本的放置策略

    下面的这种是针对于塔式服务器的副本的放置策略

  10. 深入剖析Windows专业版安装Docker引擎和Windows家庭版Docker引擎安装的区别

    原创声明:作者:Arnold.zhao  博客园地址:https://www.cnblogs.com/zh94 公司使用的电脑是Windows专业版,所以配置本机的Docker时会方便许多,后续由于需 ...