Object.assign 这算是深拷贝吗

在JavaScript中,Object.assign() 是一个用于合并对象属性的常见方法。然而,对于许多开发者来说,关于它是否执行深拷贝的认识可能存在一些混淆。先说答案Object.assign() 不属于深拷贝,我们接着往下看。

Object.assign() 概览

首先,让我们回顾一下 Object.assign() 的基本用法。该方法用于将一个或多个源对象的属性复制到目标对象,并返回目标对象。这一过程是浅拷贝的,即对于嵌套对象或数组,只是拷贝了引用而非创建新的对象。

const obj = { a: 1, b: { c: 2 } };
const obj2 = { d: 3 };const mergedObj = Object.assign({}, obj, obj2);console.log(mergedObj);
// 输出: { a: 1, b: { c: 2 }, d: 3 }

浅拷贝的陷阱

浅拷贝的特性意味着如果源对象中包含对象或数组,那么它们的引用将被复制到新的对象中。这可能导致问题,尤其是在修改新对象时,原始对象也会受到影响。

const obj = { a: 1, b: { c: 2 } };
const clonedObj = Object.assign({}, obj);
clonedObj.b.c = 3;console.log(obj);         // { a: 1, b: { c: 3 } }
console.log(clonedObj);   // { a: 1, b: { c: 3 } }

在这个例子中,修改 clonedObj 的属性也会影响到原始对象 obj

因此,如果我们需要创建一个全新且独立于原始对象的拷贝,我们就需要进行深拷贝。而 Object.assign() 并不提供深拷贝的功能。

深拷贝的需求

如果你需要进行深拷贝而不仅仅是浅拷贝,就需要使用其他的方法,如使用递归或第三方库来实现深度复制。以下是几种常见的深拷贝方法:

1. 使用 JSON 序列化和反序列化

const obj = { a: 1, b: { c: 2 } };
const deepClonedObj = JSON.parse(JSON.stringify(obj));
deepClonedObj.b.c = 3;console.log(obj);            // { a: 1, b: { c: 2 } }
console.log(deepClonedObj);  // { a: 1, b: { c: 3 } }

这种方法利用了 JSON 的序列化反序列化过程,通过将对象转换为字符串,然后再将字符串转换回对象,实现了一个全新的深拷贝对象。

需要注意的是,这种方法有一些限制,例如无法处理包含循环引用的对象,以及一些特殊对象(如 RegExp 对象)可能在序列化和反序列化过程中失去信息。

2. 使用递归实现深拷贝

function deepClone(obj) {if (obj === null || typeof obj !== 'object') {return obj;}const clonedObj = Array.isArray(obj) ? [] : {};for (let key in obj) {if (obj.hasOwnProperty(key)) {clonedObj[key] = deepClone(obj[key]);}}return clonedObj;
}const obj = { a: 1, b: { c: 2 } };
const deepClonedObj = deepClone(obj);
deepClonedObj.b.c = 3;console.log(obj);            // { a: 1, b: { c: 2 } }
console.log(deepClonedObj);  // { a: 1, b: { c: 3 } }

这是一个递归实现深拷贝的方法。它会递归地遍历对象的属性,并创建它们的副本。这种方法相对灵活,可以处理各种情况。

但需要注意在处理大型对象或深度嵌套的对象时可能会导致栈溢出。

3. 使用第三方库

许多第三方库提供了强大而灵活的深拷贝功能,其中最常用的是 lodash 库中的 _.cloneDeep 方法。

const _ = require('lodash');const obj = { a: 1, b: { c: 2 } };
const deepClonedObj = _.cloneDeep(obj);
deepClonedObj.b.c = 3;console.log(obj);            // { a: 1, b: { c: 2 } }
console.log(deepClonedObj);  // { a: 1, b: { c: 3 } }

使用第三方库的优势在于它们通常经过精心设计和测试,可以处理更多的边界情况,并提供更好的性能。

 前端面试题库 (面试必备)            推荐:★★★★★

地址:前端面试题库

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

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

相关文章

某资产管理系统打点过程中的免杀经历

上周,被扔过来单位内部的一个链接,让渗透一下,本以为三下五除二很快就能测完,没想到在对抗杀软时费了一番功夫,再加上杂七杂八的事儿,经过了一个星期才测完(# ̄~&#xff…

贪心 Leetcode 45 跳跃游戏II

跳跃游戏II Leetcode 45 学习记录自代码随想录 给定一个长度为 n 的 0 索引整数数组 nums。初始位置为 nums[0]。 每个元素 nums[i] 表示从索引 i 向前跳转的最大长度。换句话说&#xff0c;如果你在 nums[i] 处&#xff0c;你可以跳转到任意 nums[i j] 处: 0 < j < …

C#知识点-21(初识数据库)

数据库与内存、文件的比较 内存&#xff1a; 优点&#xff1a;存取速度快 缺点&#xff1a;-容量小 -断电后&#xff0c;数据不会保存 文件&#xff1a; 优点&#xff1a;数据可以持久化保存 缺点&#xff1a;-读取速度慢…

mprpc分布式RPC网络通信框架

mprpc 项目介绍 该项目是一个基于muduo、Protobuf和Zookeeper实现的轻量级分布式RPC网络通信框架。 可以把任何单体架构系统的本地方法调用&#xff0c;重构成基于TCP网络通信的RPC远程方法调用&#xff0c;实现同一台机器的不同进程之间的服务调用&#xff0c;或者不同机器…

下载无水印抖音视频

在抖音看到某些视频想下载&#xff0c;却出现无法保存在本地【显示"作品暂时无法保存,链接已复制"】。或者下载的视频有水印。 而某些微信小程序下载可能需要付费或者有水印。其实我们可以直接使用电脑浏览器直接下载。 举个例子: 这是来自王道官方账号的一条视频链…

基于springboot的某大学外卖系统的实现(源码+论文)

文章目录 目录 文章目录 前言 一、功能设计 二、功能实现 1 后台登录 2管理员界面 3员工信息管理 4客户信息管理 三、库表设计 四、论文 前言 如今&#xff0c;信息化不断的高速发展&#xff0c;社会也跟着不断进步&#xff0c;现今的社会&#xff0c;各种工作都离不开信息化技…

Python基础二

一、变量 在编程中&#xff0c;变量是用来存储数据值的名称。在 Python 中&#xff0c;变量是动态类型的&#xff0c;这意味着你可以将任何类型的数据分配给一个变量&#xff0c;而不需要提前声明变量的类型。 1、全局变量 在函数外部定义的变量是全局变量&#xff0c;可以在程…

boost 编译

参考博客&#xff1a;vs2019 boost 入坑指南 boost下载 官方网站&#xff1a;https://www.boost.org/ 下面以boost_1_73_0为例&#xff1a; boost编译 解压boost_1_73_0.zip运行bootstrap.bat&#xff08;此时目录下会生成b2.exe&#xff09;编译boost b2 install --build…

【vue2项目总结】——动态渲染

文章目录 主页渲染封装接口页面调用传到子组件 搜索列表渲染根据关键字搜索分类id搜索 主页渲染 封装接口 封装准备接口 api/home.js import request from /utils/request// 获取首页数据 export const getHomeData () > {return request.get(/page/detail, {params: {p…

springboot3.x集成SpringDoc Swagger3

近期将springboox2.x升级到了3.x&#xff0c;索性将swagger2也同步升级到swagger3&#xff0c;具体过程如下。 一、添加maven依赖 <dependency><groupId>org.springdoc</groupId><artifactId>springdoc-openapi-starter-webmvc-ui</artifactId>…

详解Java中的注解

在Java中&#xff0c;注解(Annotation)引入始于Java5&#xff0c;用来描述Java代码的元信息&#xff0c;通常情况下注解不会直接影响代码的执行&#xff0c;尽管有些注解可以用来做到影响代码执行。 注解可以做什么 Java中的注解通常扮演以下角色 编译器指令构建时指令运行时…

信息系统项目管理

信息系统项目管理 文章目录 信息系统项目管理前言一、信息系统管理介绍二、信息系统项目管理基础三、项目立项管理四、项目整体管理五、项目变更管理六、项目收尾管理七、项目范围管理八、项目进度管理九、项目成本管理十、项目质量管理十一、项目人力资源管理十二、项目沟通管…

Java的数据类型与变量详解

数据类型与变量 文章目录 数据类型与变量前言一、数据类型1. 基本数据类型2. 引用数据类型 二、包装类型1. 包装类型简介2. 自动装箱与拆箱3. 包装类型的常用方法4. 注意事项5. 示例 三、变量1. 变量声明2. 变量赋值3. 变量声明与赋值同时进行4. 示例 四、总结 前言 在Java编程…

用户角色的重要性:确保财务数据安全的最佳方式

在企业的财务管理业务中&#xff0c;一个人几乎不可能完成所有的财务记账任务&#xff0c;例如设定预算、发票审批等等&#xff0c;至少不能有效地执行。最为明智的方式&#xff0c;是将这些任务分派给特定的人员&#xff0c;比如部门经理、财务经理或者销售、市场人员等等。 但…

C++读取NC数据的结果与真实数值不一致的解决方法

本文介绍基于C 语言的netCDF库读取.nc格式的栅格文件时&#xff0c;代码读取到的数据与栅格文件的实际数据不一致的解决方法。 最近&#xff0c;由于需要读取ERA5气象数据&#xff0c;因此使用C 语言中的netCDF库读取.nc格式文件。其中&#xff0c;偶然发现在Visual Studio的代…

Acwing枚举、模拟与排序(二)

回文日期 原文链接&#xff1a;https://www.acwing.com/problem/content/468/ 由于只有八位数&#xff0c;而且回文串左右对称&#xff0c;因此可以只枚举左半边。然后判断&#xff1a; 整个八位数日期是否合法是否在范围内 一共枚举1e4个数。判断过程是常数级别的&#xff0…

CC攻击的特征和防护措施

随着互联网的快速发展&#xff0c;网络攻击日益频繁。在目前的各种网络攻击中&#xff0c;CC攻击是一种常见的网络攻击手段之一。CC攻击&#xff08;也称为DDoS攻击&#xff09;是指通过大量请求或恶意流量向目标网站或服务器发送请求&#xff0c;以使其服务不可用。可能大家都…

Error:java:JDK isn‘t specified for module “模块名称“

可能是创建模块后不小心删掉了.idea.或.idea出错 只要删除.idea&#xff0c;close project出去&#xff0c;重新进让idea自动下载

VS2022打包C#安装包(最新、最全)

开发c#的一个小工具到打包环境碰壁了&#xff0c;在网上找了很多资料耶踩了很多坑&#xff0c;耗时1hour才打包完毕&#xff0c;避免以后碰到类似的问题再次记录&#xff0c;自认为步骤比较全面&#xff0c;如果有帮助麻烦点个赞呗&#xff01;&#xff01;&#xff01; 一、Mi…

QT状态机入门

Qt状态机&#xff08;QStateMachine&#xff09;是Qt框架中用于管理状态和状态转换的一种工具。它允许您将程序的行为分解为一系列离散的状态&#xff0c;并根据一定的条件进行状态之间的转换。Qt状态机提供了一个灵活的、可视化的方式来描述程序的状态和状态转换关系。 优点&…