手写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 ...
随机推荐
- Linuxt通过命令lsof或者extundelete工具恢复误删除的文件或者目录
Linux不像windows有那么显眼的回收站,不是简单的还原就可以了.linux删除文件还原可以分为两种情况,一种是删除以后在进程存在删除信息,一种是删除以后进程都找不到,只有借助于工具还原.这里分 ...
- Android集成并开启手写笔识别
1.首先,需要下载Pdf xchange View SDK,然后将其集成到Android项目中: 2.在Android项目中,添加以下依赖: implementation 'com.github.PD ...
- sync.Once
保证在 Go 程序运行期间的某段代码只会执行一次 func main() { o := &sync.Once{} for i := 0; i < 10; i++ { o.Do(func( ...
- 实验一 密码引擎-2-OpenEuler-OpenSSL测试
任务详情 在Ubuntu编写代码测试OpenSSL功能,包含Base64,SM2,SM3,SM4算法的调用,然后在OpenEuler中重现 提交代码链接和运行结果截图 加分项:在Windows中重现 ...
- BLOG-2
前言 这几次的PTA作业和考试涉及到的知识点有面向对象中对数据的封装,还有继承和多态,还有抽象类和对象容器 也涉及到了一些,同时还有关于正则表达式的一些内容.而关于题量,这应该对于一个初学者来说是一个 ...
- vue用echarts不显示
在html页面中套vue的情况来使用echarts,或者单独vue使用echarts,出现页面不渲染图表,代码渲染有的情况,加个this.$nextTick(()=>{})让他主动渲染一下就可以 ...
- 有道翻译-JS逆向-api调用
简单方法 -调用开源api 这个比较简单四行代码就可以搞定,先放代码: 1 import requests 2 while True: 3 input_data = input('请输入你要翻译的数据 ...
- Generative Adversarial Network - Python实现
算法特征 ①. discriminator区别真假; ②. generator以假乱真 算法推导 Part Ⅰ: 熵之相关定义 entropy之定义如下, \[\begin{equation*} H( ...
- Symfony2在Nginx下的配置方法图文教程
来源: https://www.xp.cn/b.php/79706.html Symfony2在Nginx下的配置方法图文教程 本文详细讲述了Symfony2在Nginx下的配置方法.分享给大家供大家 ...
- 批量获取title
1 import requests 2 from bs4 import BeautifulSoup 3 import pandas as pd 4 from openpyxl import Workb ...