JS实现对对象的深拷贝
手动遍历对象拷贝
/**
* 深拷贝
* @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实现对对象的深拷贝的更多相关文章
- JS 数组以及对象的深拷贝总结
javascript 数组以及对象的深拷贝(复制数组或复制对象)的方法 前言 在js中,数组和对象的复制如果使用=号来进行复制,那只是浅拷贝.如下图演示: 如上,arr的修改,会影响arr2的值,这 ...
- JS 数组、对象的深拷贝
博客地址:https://ainyi.com/72 JavaScript 程序中,对于简单的数字.字符串可以通过 = 赋值拷贝 但是对于数组.对象.对象数组的拷贝,就有浅拷贝和深拷贝之分 浅拷贝就是当 ...
- js中json对象的深拷贝
/** * 对象深拷贝 * @param obj */ function deepCopy(obj) { var txt=JSON.stringify(obj); return JSON.parse( ...
- JS中有关对象的继承以及实例化、浅拷贝深拷贝的奥秘
一.属性的归属问题 JS对象中定义的属性和方法如果不是挂在原型链上的方法和属性(直接通过如类似x的方式进行定义)都只是在该对象上,对原型链上的没有影响.对于所有实例共用的方法可直接定义在原型链上这样实 ...
- JS中如何进行对象的深拷贝
在JS中,一般的=号传递的都是对象/数组的引用,并没有真正地拷贝一个对象,那如何进行对象的深度拷贝呢?如果你对此也有疑问,这篇文章或许能够帮助到你 一.对象引用.浅层拷贝与深层拷贝的区别 js的对象引 ...
- JS对象复制(深拷贝、浅拷贝)
如何在 JS 中复制对象 在本文中,我们将从浅拷贝(shallow copy)和深拷贝(deep copy)两个方面,介绍多种 JS 中复制对象的方法. 在开始之前,有一些基础知识值得一提:Javas ...
- JS如何进行对象的深克隆(深拷贝)?
JS中,一般的赋值传递的都是对象/数组的引用,并没有真正的深拷贝一个对象,如何进行对象的深拷贝呢? var a = {name : 'miay'}; var b = a; b.name = 'Jone ...
- js对象的深拷贝
关于对象的深拷贝一直是大家津津乐道一个话题,本骚年通过研究(yuedu)发现还是很easy的. 首推的方法简单有效,JSON.stringfy()和JSON.parse()即可搞定.但是这种简单粗暴的 ...
- JS数组和对象的浅拷贝和深拷贝
共勉~ 在许多编程语言中,传递参数和赋值是通过值的直接复制或者引用复制完成的.在JavaScript中,对于值是直接进行复制还是引用复制在语法上是没有区别的,完全是根据值的类型来决定的. 在JavaS ...
随机推荐
- python中的数学类型及操作
一.概述 整数类型 浮点数类型 复数类型 round()函数 数值运算符 数值运算函数 字符串类型 1.整数类型 整型:用来描述什么:比如身高,体重,年龄等 eg: age=20 height=168 ...
- Refusing to install package with name "webpack" under a package
最近学习webpack 知识时 下载依赖结果报了这个错 查阅资料后发现是 这个name 不能使用所需要安装包的名字! 换为其他之后 再次操作命令 就没问题了
- js语言简介
JS语言概述 JS语言简史 JS语言的起源 网景(Netscape Communication Corperation),1994年,推出第一款商用浏览器,网景浏览器(Netscape Navigat ...
- Mybatis plus中一个框多条件查询 SQL拼接
遇到多条件查询时,只用框架自带的方法搞不定,只能自己写方法拼接 EntityWrapper<YcejShopEntity> wrapper = new EntityWrapper<& ...
- Go键盘输入和打印输出
package main import ( "fmt" "bufio" "os" ) func main() { /* 输入和输出: fmt ...
- Innovus 对multibit 的支持
如果在综合阶段没有做multibit merge, 或综合阶段由于缺失物理信息multibit cell merge 不合理,那就需要PR 工具做multibit merge 或split. Inno ...
- Mac配置内网穿透
闲语: Java开发过程中,往往会对接第三方,而在对接过程中,双方间使用的最多的"通讯"方式就是异步通知.可是异步通知过程中,只能通知到外网地址,可是在调试过程我们都是在本地进行- ...
- HTML连载59-子绝父相
一.子绝父相 1.只使用相对定位,对图片的位置进行精准定位. <!DOCTYPE html> <html lang="en"> <head> & ...
- Servlt入门
Servlt入门 java的两种体系结构 C/S (客户端/服务器)体系结构 通讯效率高且安全,但系统占用多 B/S (浏览器/服务器)体系结构 节约开发成本 C/S (客户端/服务器)体系结 ...
- BZOJ 3262: 陌上花开 (cdq分治,三维偏序)
#include <iostream> #include <stdio.h> #include <algorithm> using namespace std; c ...