手写JS深拷贝
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>JS深拷贝</title>
</head>
<body> </body>
<script>
let obj = {
name: '张三',
age:22,
arr: [1,2,'dadas'],
where: {
country1: '中国',
country2: '府谷',
}
} function deepClone(obj) {
if(obj === null || typeof obj !== 'object') {
return obj;
}
let result;
if(obj instanceof Array) {
result = []
} else {
result = {}
}
for(let key in obj) {
if(obj.hasOwnProperty(key)) {
result[key] = deepClone(obj[key])
}
}
return result
} let newObj = deepClone(obj);
console.log(newObj);
newObj.name = 999;
console.log(newObj);
console.log(obj); </script>
</html>
方法二：
- 函数 正则 日期 ES6新对象 等不是直接返回其地址，而是重新创建
- 需要避免出现循环引用的情况
const _completeDeepClone = (target, map = new WeakMap()) => {
// 基本数据类型，直接返回
if (typeof target !== 'object' || target === null) return target
// 函数 正则 日期 ES6新对象,执行构造题，返回新的对象
const constructor = target.constructor
if (/^(Function|RegExp|Date|Map|Set)$/i.test(constructor.name)) return new constructor(target)
// map标记每一个出现过的属性，避免循环引用
if (map.get(target)) return map.get(target)
map.set(target, true)
const cloneTarget = Array.isArray(target) ? [] : {}
for (prop in target) {
if (target.hasOwnProperty(prop)) {
cloneTarget[prop] = _completeDeepClone(target[prop], map)
}
}
return cloneTarget
}
手写JS深拷贝的更多相关文章
- 手写js面向对象选项卡插件
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&qu ...
- 手写JS无缝滚动插件
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&qu ...
- vue10行代码实现上拉翻页加载更多数据，纯手写js实现下拉刷新上拉翻页不引用任何第三方插件
vue10行代码实现上拉翻页加载更多数据,纯手写js实现下拉刷新上拉翻页不引用任何第三方插件/库 一提到移动端的下拉刷新上拉翻页,你可能就会想到iScroll插件,没错iScroll是一个高性能,资源 ...
- cocos2dx手写js绑定C++
这两天连续查阅了js绑定c++的非常多文章 , 有手动与自己主动两种方式 . 本来想用自己主动绑定的 , 可是NDK一直下载不下来.....就给算了 . 以下总结一下手动绑定的实现过程 : 一共三步 ...
- 手写js代码（一）javascript数组循环遍历之forEach
注:原文地址http://blog.csdn.net/oscar999/article/details/8671546 我这里是仿照学习! 1.js的数组循环遍历 ①数组的遍历首先想到的是for()循 ...
- 前端小插件之手写js循环滚动特效
很多前端都离不开滚动的特效,调用插件繁琐,后期更改麻烦,考虑到这些因素,自己写了一套无限循环滚动的小特效. 首先滚动特效很好写,用css就可以完成,下面写一个基础css向上循环滚动特效 html &l ...
- js深拷贝你还不会吗
js深拷贝 在讲正题之前我们要先了解数据存储的方式 数据存储方式 在讲之前我们要先知道值类型和引用类型的存储方式. 在JavaScript数据类型中有两种数据类型. 值类型:字符串(String).数 ...
- 2019前端面试系列——JS高频手写代码题
实现 new 方法 /* * 1.创建一个空对象 * 2.链接到原型 * 3.绑定this值 * 4.返回新对象 */ // 第一种实现 function createNew() { let obj ...
- 常见的JS手写函数汇总（代码注释、持续更新）
最近在复习面试中常见的JS手写函数,顺便进行代码注释和总结,方便自己回顾也加深记,内容也会陆陆续续进行补充和改善. 一.手写深拷贝 <script> const obj1 = { name ...
- 原生html、js手写 radio与checkbox 美化
原生html.js手写 radio与checkbox 美化 html <!DOCTYPE html> <html> <head> <meta charse ...
随机推荐
- MapReduce原理——Shuffle机制
在Map方法之后,Reduce方法之前的数据处理过程称之为Shuffle. Map方法输出的数据会获得对应的分区,进入环形缓冲区(缓冲区一半写索引,另一半写数据).数据达到缓冲区的80%会发生溢写.在 ...
- 072_关于Dataloader导入Record的创建时间及修改时间并允许owner是Inactive
1.在User interface 中 启用 Enable "Set Audit Fields upon Record Creation" and "Update Rec ...
- django项目 在进行数据生成迁移文件makemigrations时报Please select a fix:...
问题:django项目 在进行生成迁移文件:python .\manage.py makemigrations时,报错,如图 原因:在之前项目新建模型的时候,缺少一个字段进行迁移了然后数据表中又产生了 ...
- PK获取面积
BOOL PK_AskFaceAreas(tag_t face_tag, double tol, double &areas) {//获得面积 tag_t ps_tag = NULL_TAG; ...
- 利用拉格朗日乘子法从最优化问题中推导出KKT条件
优化问题的一般形式 在优化问题中,我们将其一般形式定义为有约束(不等式约束.等式约束)的最小化优化问题,其具体定义如下: \[\begin{array}{ll} \min _{x} & f_{ ...
- Java笔记_this关键字_HomeWork（9 - 题）
第九题 /** * @ClassName HomeWork09 * @Description TODO * @Author Orange * @Date 2021/4/26 16:20 * @Vers ...
- 在前端js worker里使用dom并且加载jquery
四个工具: nodejs + npm npm安装的jsdom npm安装的jquery npm安装的browserify 网址: browserify: https://browserify.org/ ...
- [1] Multi-View Transformer for 3D Visual Grounding 论文精读
参考: https://zhuanlan.zhihu.com/p/467913475 3D Visual Grounding小白调研笔记 https://zhuanlan.zhihu.com/p/34 ...
- 【uboot 】uboot通过tftp下载内核
1.开发板uboot,虚拟机能相互ping通 2.ubuntu搭建好tftp服务器,设置好文件夹,放置好文件 sudo apt install tftpd-hpa //安装服务程序 sudo sys ...
- 树莓派，脚本遍历当前目录下视频文件，并用omxplayer播放
事先准备好视频文件,文件名内包含视频尺寸信息,以方便构造 --win "x1 y1 x2 y2" 字符串. 通过 omxplayer -i filename 可查看视频尺寸 ...