深浅拷贝以及函数缓存

目录

数据类型介绍

基本数据类型(Primitive Types)

引用数据类型(Reference Types)

浅拷贝

深拷贝

利用JSON的序列化和反序列化实现深拷贝

递归实现深拷贝

第三方库lodash的cloneDeep

函数缓存的概念

 实现方法


数据类型介绍

要想了解深浅拷贝,首先得知道有哪些数据类型。在Javascript中,存在两大数据类型:

基本数据类型(Primitive Types)

JavaScript的基本数据类型包括以下六种:

  • Number: 用于表示整数或浮点数。例如:423.14
  • String: 用于表示文本数据。例如:"hello"'world'
  • Boolean: 表示逻辑值,只有truefalse两种。
  • Undefined: 表示变量未定义或未赋值。例如:let a;,此时aundefined
  • Null: 表示空值,通常用于明确赋空值的情况。例如:let b = null;
  • Symbol(ES6新增):表示唯一且不可变的值,通常用于对象属性的键。例如:Symbol('id')

基本数据类型的特点是不可变,直接存储在栈内存中。

引用数据类型(Reference Types)

引用数据类型主要包括以下两种:

  • Object: 用于存储键值对或复杂数据结构。例如:{ name: "Alice", age: 25 }
  • Array: 是特殊的对象,用于存储有序数据。例如:[1, 2, 3]
  • Function: 也是对象的一种,可以被调用执行。例如:function() { return "hello"; }
  • DateRegExp等内置对象。

引用数据类型的特点是可变,数据存储在堆内存中,变量存储的是指向堆内存的地址。

在编程中,基本数据类型通常不涉及深拷贝或浅拷贝的概念。所以面试常问的深浅拷贝指的是针对引用数据的处理。

浅拷贝

仅复制对象的顶层属性,如果属性是引用类型(如数组、对象),则复制的是引用而非实际对象。因此,修改拷贝后的引用类型属性会影响原对象。

实现浅拷贝的方式有很多,举几个案例:

 
// Object.assign()
// 使用 Object.assign() 可以快速实现浅拷贝:
const original = { a: 1, b: { c: 2 } };
const copy = Object.assign({}, original);// 展开运算符(...)
// ES6 的展开运算符也能实现浅拷贝:
const original = { a: 1, b: { c: 2 } };
const copy = Object.assign({}, original);// 数组的浅拷贝
// 对于数组,可以使用 slice() 或 concat():
const originalArray = [1, 2, { a: 3 }];
const copyArray = originalArray.slice();

注意

引用赋值共享同一个对象,无独立性,不属于浅拷贝
浅拷贝第一层属性独立,嵌套引用类型仍共享

var a = {a:1}
var b = a

深拷贝

会递归复制对象的所有层级,包括引用类型属性,生成一个完全独立的新对象。修改深拷贝后的对象不会影响原对象。

深拷贝开辟一个新的栈,两个对象的属性完全相同,但是对应两个不同的地址,修改一个对象的属性,不会改变另外一个

利用JSON的序列化和反序列化实现深拷贝

JSON.parse(JSON.stringify())

优点:简单易用,常见的深拷贝的方法

缺点:无法处理函数、Symbol、undefined等非 JSON 兼容类型,会丢失这些属性

const original = { a: 1, b: { c: 2 } };
const copy = JSON.parse(JSON.stringify(original));

递归实现深拷贝

优点:可以处理各种类型

缺点:需要手动处理循环引用等问题

function deepClone(obj) {if (obj === null || typeof obj !== 'object') {return obj;}const clone = Array.isArray(obj) ? [] : {};for (let key in obj) {if (obj.hasOwnProperty(key)) {clone[key] = deepClone(obj[key]);}}return clone;
}

第三方库lodash的cloneDeep

优点:功能完善,处理了各种边界情况

缺点:需要引入额外库

const _ = require('lodash');
const obj = {a: 1, b: {c: 2}};
const clone = _.cloneDeep(obj);

函数缓存的概念

函数缓存是一种优化技术,通过存储函数计算结果避免重复执行相同输入的计算。适用于计算成本高或输入输出稳定的场景,如递归、API调用或数学运算。

函数缓存,就是将函数运算过的结果进行缓存,本质上就是用空间(缓存存储)换时间(计算过程),常用于缓存数据计算结果和缓存对象

 实现方法

实现函数缓存主要依靠闭包、柯里化、高阶函数。详解在其他文章。

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

第六届信号处理与计算机科学国际学术会议(SPCS 2025)

重要信息 官网:www.icspcs.org (详情见官网) 时间:2025年8月15-17日 地点:西安 主题 信号处理与智能计算计算科学与人工智能网络与多媒体技术数字信号处理 雷达信号处理 通信信号处理 临时和传感器网络 模拟和…

MongoDB:一个灵活的、可扩展的 NoSQL 数据库

🤍 前端开发工程师、技术日更博主、已过CET6 🍨 阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1 🕠 牛客高级专题作者、打造专栏《前端面试必备》 、《2024面试高频手撕题》、《前端求职突破计划》 🍚 蓝桥云课签约作者、…

系统思考场景应用

最近一直在与不同行业头部企业共同探讨系统思考这个主题。一些新的合作伙伴也常常问我,系统思考究竟能为客户解决什么痛点? 这两天上课客户的核心需求是:全局思维。在过去的几年里,我深切体会到,随着外部环境的快速变化…

SQL预编译:安全高效数据库操作的关键

通过占位符(如 ? 或命名参数)编写预编译的 SQL 语句(通常通过 PreparedStatement 实现)是数据库操作的最佳实践,主要好处包括:🔒 1. 防止 SQL 注入攻击(核心安全优势) 问…

springboot实验室管理系统-计算机毕业设计源码20916

摘 要 随着高校实验室管理需求的不断增加,传统的管理方式已经难以满足现代教育的要求。为了解决这一问题,本文设计并实现了一种基于VUE和SpringBoot的实验室管理系统。该系统采用前后端分离的架构,前端使用VUE框架,后端基于Sprin…

spdringboot共享学习室小程序 计算机毕业设计源码27728

摘 要 共享学习室小程序是一款基于SpringBoot框架开发的移动端应用,旨在提供一个便捷的自习室预约、管理和资源共享平台。通过该小程序,用户可以方便地预约自习室、查看资讯、提交反馈意见,同时进行失物招领、查看订单信息等多项操作。对于管…

JVM——JVM 的内存区域是如何划分的?

Java 虚拟机运行时数据区分为方法区、堆、虚拟机栈、本地方法栈、程序计数器。 方法区(Method Area): [1] 存储类信息、常量、静态变量和即时编译器(JIT)编译后的代码。 [2] 属于线程共享区域,所有线程共享方法区内存 [3] 在 JDK8之前,HotSpot使用永久代…

SpringAi笔记

简介 :: Spring AI 中文文档 Spring AI 解决了 AI 集成的根本难题:将企业数据和 API 与 AI 模型连接起来。 聊天客户端 API (ChatClient ) 发起对模型的调用和响应 创建:其中可以通过bean来注入创建好的chatClient 可以使用Qualifier注解,…

基于SD-WAN的智慧高速解决方案:高效、低成本的智能交通实践

随着交通网络的智能化需求逐渐增加,智慧高速建设已成为提升通行效率、优化安全性、实现交通现代化管理的重要方向。在本文中,我们将以某智慧高速项目为例,详细探讨如何通过 SD-WAN 技术与多种智能化手段结合,实现“低成本、高效率…

Towards Low Light Enhancement with RAW Images 论文阅读

利用 RAW 图像实现低光增强 摘要 在本文中,我们首次进行了基准研究,详细阐述了在低光增强中使用 RAW 图像的优越性,并提出了一种新颖的替代方案,以更灵活和实用的方式利用 RAW 图像。受对典型图像处理流程的全面考虑启发&#xff…

smolagents - 如何在mac用agents做简单算术题

smolagent是hf推出的agent开发库,简洁易用。这里尝试用smolagents完成简单数学题目。 1 smolagents安装 conda create -n smolagents python3.12 conda activate smolagents pip install smolagents pip install smolagents[mlx-lm] 由于是在mac使用mlx,…

【无标题】LighthouseGS:面向全景式移动拍摄的室内结构感知三维高斯泼溅

标题&#xff1a;<LighthouseGS: Indoor Structure-aware 3D Gaussian Splatting for Panorama-Style Mobile Captures> 论文&#xff1a;https://arxiv.org/pdf/2507.06109 来源&#xff1a;南京大学&#xff1b;复旦大学&#xff1b;华为诺亚实验室 文章目录摘要一、前…

el-table中type=“selection“选中数据如何回显

效果如下代码如下 关键函数&#xff1a;toggleRowSelection(this.tableData[i])设置默认选中数据。 <template><el-tableref"multipleTable":data"tableData"tooltip-effect"dark"style"width: 100%"selection-change"h…

为来时路,OCM拿证学习和考试

为何选择OCM&#xff1f;OCM的含金量无需多言。全球持证人数不足万人&#xff0c;中国地区更是寥寥千人。它不仅是技术实力的象征&#xff0c;更是通往金融、互联网、通信等核心企业高薪岗位的“通行证”。据行业数据显示&#xff0c;持有OCM认证的技术人员&#xff0c;薪资普遍…

beautiful-react-hooks库——入门实践常用hook详解

简介 beautiful-react-hooks 是一个专为 React 设计的高质量自定义 Hooks 集合&#xff0c;涵盖了事件、状态、生命周期、DOM 操作、性能优化等多个方面&#xff0c;极大提升了函数组件的开发效率和代码复用性。 安装方法 npm install beautiful-react-hooks # 或 yarn add …

DOM 规范中的 MutationObserver 接口

MutationObserver 接口DOM规范中的 MutationObserver 接口可以在DOM被修改时异步执行回调。使用MutationObserver可以观察整个文档、DOM树的一部分或某个元素&#xff0c;元素属性、字节点、文本等。新引进的MutationObserver接口取代了已废弃的MutationEvent。MutationObserve…

3.7 小结

图3-7-1点云可视化点云可视化工具就像是打开点云数据宝藏大门的钥匙&#xff0c;能让我们直观地理解和分析这些复杂的数据。本章节&#xff0c;主要介绍了PCL、Open3D、Matplotlib、PCShow、VTK 这几种点云可视化工具。PCL&#xff08;Point Cloud Library&#xff09;是专注于…

对称二叉树、二叉树直径

101. 对称二叉树 - 力扣&#xff08;LeetCode&#xff09; 法一&#xff1a;递归。 对于两个对称位置的节点L和R&#xff08;L在左子树&#xff0c;R在右子树&#xff09;&#xff0c;只有当L的左节点值R的右节点值且L的右节点值R的左节点值时&#xff0c;这棵二叉树才有可能对…

Java多线程1

线程是操作系统能够运行调度的最小单位&#xff0c;它包含在进程之中&#xff0c;是进程的实际运作单位多线程有三种实现方式线程实现方法1&#xff0c;继承Thread类&#xff08;无返回值&#xff09;&#xff1a;1、继承Thread2、重写run方法&#xff08;线程要执行的代码&…

云计算如何提高企业的数据安全性和隐私保护

在企业数字化转型加速推进的今天&#xff0c;数据安全与隐私保护已成为决定企业生存发展的核心命题。云计算凭借其灵活的架构优势&#xff0c;不仅重塑了企业资源管理模式&#xff0c;更在数据安全防护领域构建起多层次保障体系。以下从六大维度解析云计算如何为企业数据安全与…