JS深拷贝与对象比较简单实现

2023-10-24 13:28

本文主要是介绍JS深拷贝与对象比较简单实现,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

最近在看《现代JavaScript库开发》,第一章深拷贝函数如下:

function clone(source) {const aType = type(source);if (aType !== 'array' && aType !== 'object') {return source;}let target;if (aType === 'object') {target = {};for(let k in source){if (source.hasOwnProperty(k)) {target[k] = clone(source[k]);}}} else {target = [];for (let i in source) {target[i] = clone(source[i]);}}return target;}function type(a) {return Object.prototype.toString.call(a).slice(8, -1).toLowerCase();
}const a = {age: 14, name: 'zs'};
const b = clone(a);
a.age = 28;
a.name = 'ls';console.log(b)

这是个基础版,不过还是很有学习空间的,于是自己接着这个思路也Mock了一个isEqual函数:

function equal(c1, c2) {const c1Type = type(c1);const c2Type = type(c2);if (c1Type !== c2Type) {return false;}if (c1Type !== 'array' && c1Type !== 'object') {return c1 === c2;}if (!compareKeysArray(Object.keys(c1), Object.keys(c2))) {return false;}for (let k in c1) {if (!equal(c1[k], c2[k])) {return false;}}return true;}function compareKeysArray(arr1, arr2) {arr1.sort();arr2.sort();if (arr1.length !== arr2.length) {return false;}for (let [i, v] of arr1.entries()) {if (v !== arr2[i]) {return false;}}return true;
}function type(a) {return Object.prototype.toString.call(a).slice(8, -1).toLowerCase();
}const obj1 = { a: 1, b: 2, c: undefined };
const obj2 = { b: 2, d: undefined, a: 1 };
console.log(equal(obj1, obj2));

这个只是beta版,感觉还有很多优化空间。后续有更新了再补充。

还有一种流传的方法就是使用JSON.stringify,但是当key的顺序不一样的时候就尴尬了:

const obj1 = { a: 1, b: 2, c: undefined };
const obj2 = { b: 2, c: undefined, a: 1 };
console.log(JSON.stringify(obj1) === JSON.stringify(obj2)); // false

这篇关于JS深拷贝与对象比较简单实现的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!


原文地址:
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.chinasem.cn/article/275462

相关文章

使用animation.css库快速实现CSS3旋转动画效果

《使用animation.css库快速实现CSS3旋转动画效果》随着Web技术的不断发展,动画效果已经成为了网页设计中不可或缺的一部分,本文将深入探讨animation.css的工作原理,如何使用以及... 目录1. css3动画技术简介2. animation.css库介绍2.1 animation.cs

Java进行日期解析与格式化的实现代码

《Java进行日期解析与格式化的实现代码》使用Java搭配ApacheCommonsLang3和Natty库,可以实现灵活高效的日期解析与格式化,本文将通过相关示例为大家讲讲具体的实践操作,需要的可以... 目录一、背景二、依赖介绍1. Apache Commons Lang32. Natty三、核心实现代

SpringBoot实现接口数据加解密的三种实战方案

《SpringBoot实现接口数据加解密的三种实战方案》在金融支付、用户隐私信息传输等场景中,接口数据若以明文传输,极易被中间人攻击窃取,SpringBoot提供了多种优雅的加解密实现方案,本文将从原... 目录一、为什么需要接口数据加解密?二、核心加解密算法选择1. 对称加密(AES)2. 非对称加密(R

基于Go语言实现Base62编码的三种方式以及对比分析

《基于Go语言实现Base62编码的三种方式以及对比分析》Base62编码是一种在字符编码中使用62个字符的编码方式,在计算机科学中,,Go语言是一种静态类型、编译型语言,它由Google开发并开源,... 目录一、标准库现状与解决方案1. 标准库对比表2. 解决方案完整实现代码(含边界处理)二、关键实现细

python通过curl实现访问deepseek的API

《python通过curl实现访问deepseek的API》这篇文章主要为大家详细介绍了python如何通过curl实现访问deepseek的API,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编... API申请和充值下面是deepeek的API网站https://platform.deepsee

SpringBoot实现二维码生成的详细步骤与完整代码

《SpringBoot实现二维码生成的详细步骤与完整代码》如今,二维码的应用场景非常广泛,从支付到信息分享,二维码都扮演着重要角色,SpringBoot是一个非常流行的Java基于Spring框架的微... 目录一、环境搭建二、创建 Spring Boot 项目三、引入二维码生成依赖四、编写二维码生成代码五

MyBatisX逆向工程的实现示例

《MyBatisX逆向工程的实现示例》本文主要介绍了MyBatisX逆向工程的实现示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学... 目录逆向工程准备好数据库、表安装MyBATisX插件项目连接数据库引入依赖pom.XML生成实体类、

C++类和对象之初始化列表的使用方式

《C++类和对象之初始化列表的使用方式》:本文主要介绍C++类和对象之初始化列表的使用方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录C++初始化列表详解:性能优化与正确实践什么是初始化列表?初始化列表的三大核心作用1. 性能优化:避免不必要的赋值操作2. 强

C#实现查找并删除PDF中的空白页面

《C#实现查找并删除PDF中的空白页面》PDF文件中的空白页并不少见,因为它们有可能是作者有意留下的,也有可能是在处理文档时不小心添加的,下面我们来看看如何使用Spire.PDFfor.NET通过C#... 目录安装 Spire.PDF for .NETC# 查找并删除 PDF 文档中的空白页C# 添加与删

Java实现MinIO文件上传的加解密操作

《Java实现MinIO文件上传的加解密操作》在云存储场景中,数据安全是核心需求之一,MinIO作为高性能对象存储服务,支持通过客户端加密(CSE)在数据上传前完成加密,下面我们来看看如何通过Java... 目录一、背景与需求二、技术选型与原理1. 加密方案对比2. 核心算法选择三、完整代码实现1. 加密上