当前位置:首页 > 科技  > 软件

如何在JavaScript中复制一个对象?

来源: 责编: 时间:2024-04-11 08:58:22 257观看
导读JavaScript的原始数据类型是不可变的,这意味着一旦创建,它们的值就不能改变。但是,对象和数组是可变的,允许在创建后修改它们的值。实际上,这意味着原始数据是通过值传递的,而对象和数组是通过引用传递的。考虑以下例子:let

JavaScript的原始数据类型是不可变的,这意味着一旦创建,它们的值就不能改变。但是,对象和数组是可变的,允许在创建后修改它们的值。aZ028资讯网——每日最新资讯28at.com

实际上,这意味着原始数据是通过值传递的,而对象和数组是通过引用传递的。考虑以下例子:aZ028资讯网——每日最新资讯28at.com

let str = 'Hello';let copy = str;copy = 'Hi';// str = 'Hello', copy = 'Hi'let obj = { a: 1, b: 2 };let objCopy = obj;objCopy.b = 4;// obj = { a: 1, b: 4}, objCopy = { a: 1, b: 4 }

你可以看到,对象obj是通过引用传递给objCopy的。修改其中一个变量会影响另一个变量,因为它们都引用同一个对象。那我们如何解决这个问题呢?答案是克隆对象。aZ028资讯网——每日最新资讯28at.com

浅复制

使用展开运算符(...)或 Object.assign(),我们可以克隆对象并根据其属性创建一个新对象。aZ028资讯网——每日最新资讯28at.com

const shallowClone = obj => Object.assign({}, obj);let obj = { a: 1, b: 2};let clone = shallowClone(obj);let otherClone = shallowClone(obj);clone.b = 4;otherClone.b = 6;// obj = { a: 1, b: 2}// clone = { a: 1, b: 4 }// otherClone = { a: 1, b: 6 }

这种技术被称为浅复制,因为它适用于外部(浅层)对象,但如果我们有嵌套(深层)对象,则会失败,因为这些对象最终会通过引用传递。这就引出了下一部分。aZ028资讯网——每日最新资讯28at.com

图片图片aZ028资讯网——每日最新资讯28at.com

深复制

为了创建一个对象的深复制,我们需要递归地克隆每一个嵌套对象,复制嵌套对象和数组。aZ028资讯网——每日最新资讯28at.com

网上有一些解决方案使用 JSON.stringify() 和 JSON.parse()。虽然这种方法在某些情况下可能有效,但它包含许多问题和性能问题,因此我建议不要使用它。aZ028资讯网——每日最新资讯28at.com

从边界情况开始,我们需要检查传递的对象是否为空,如果是,则返回 null。否则,我们可以使用 Object.assign() 和一个空对象 ({}) 来创建原始对象的浅复制。aZ028资讯网——每日最新资讯28at.com

然后,我们将使用 Object.keys() 和 Array.prototype.forEach() 来确定需要深复制哪些键值对。如果对象是一个数组,我们将设置克隆对象的长度与原对象相等,并使用 Array.from() 创建一个克隆对象。否则,我们将递归地调用函数,把当前值作为参数传入。aZ028资讯网——每日最新资讯28at.com

深复制专用于简单对象和数组。这意味着它无法处理类实例,函数和其他特殊情况。那么,我们如何处理这些情况呢?JavaScript最近给我们提供了一个新的工具来解决这个问题!aZ028资讯网——每日最新资讯28at.com

使用 structuredClone() 进行深复制

克隆显然是一个很常见也很重要的问题。事实上,JavaScript引入了structuredClone()全局函数,可以用来深度克隆对象。而我们不需要实现复杂的递归函数,只需使用这个函数就可以克隆对象。aZ028资讯网——每日最新资讯28at.com

这种技术可用于数组和对象,代码最少,是JavaScript中克隆对象的推荐方式,因为它性能最佳且最可靠。aZ028资讯网——每日最新资讯28at.com

本文链接:http://www.28at.com/showinfo-26-82737-0.html如何在JavaScript中复制一个对象?

声明:本网页内容旨在传播知识,若有侵权等问题请及时与本网联系,我们将在第一时间删除处理。邮件:2376512515@qq.com

上一篇: 通过 Atexit 模块让 Python 实现 Golang 的 defer 功能,你学会了吗?

下一篇: 注意:Kafka 的这六个场景会丢失消息!

标签:
  • 热门焦点
  • 7月安卓手机好评榜:三星S23Ultra好评率第一

    性能榜和性价比榜之后,我们来看最后的安卓手机好评榜,数据来源安兔兔评测,收集时间2023年7月1日至7月31日,仅限国内市场。第一名:三星Galaxy S23 Ultra好评率:95.71%在即将迎来新
  • 5月安卓手机好评榜:魅族20 Pro夺冠

    性能榜和性价比榜之后,我们来看最后的安卓手机好评榜,数据来源安兔兔评测,收集时间2023年5月1日至5月31日,仅限国内市场。第一名:魅族20 Pro好评率:97.50%不得不感慨魅族老品牌还
  • K6:面向开发人员的现代负载测试工具

    K6 是一个开源负载测试工具,可以轻松编写、运行和分析性能测试。它建立在 Go 和 JavaScript 之上,它被设计为功能强大、可扩展且易于使用。k6 可用于测试各种应用程序,包括 Web
  • 一篇聊聊Go错误封装机制

    %w 是用于错误包装(Error Wrapping)的格式化动词。它是用于 fmt.Errorf 和 fmt.Sprintf 函数中的一个特殊格式化动词,用于将一个错误(或其他可打印的值)包装在一个新的错误中。使
  • 得物宠物生意「狂飙」,发力“它经济”

    作者|花花小萌主近日,得物宣布正式上线宠物鉴别,通过得物App内的“在线鉴别”,可找到鉴别宠物的选项。通过上传自家宠物的部位细节,就能收获拥有专业资质认证的得物鉴
  • ESG的面子与里子

    来源 | 光子星球撰文 | 吴坤谚编辑 | 吴先之三伏大幕拉起,各地高温预警不绝,但处于厄尔尼诺大“烤”之下的除了众生,还有各大企业发布的ESG报告。ESG是“环境保
  • 造车两年股价跌六成,小米的估值逻辑变了吗?

    如果从小米官宣造车后的首个交易日起持有小米集团的股票,那么截至2023年上半年最后一个交易日,投资者将浮亏59.16%,同区间的恒生科技指数跌幅为52.78%
  • 三星显示已开始为AR设备研发硅基LED微显示屏

    7月18日消息,据外媒报道,随着苹果首款头显产品Vision Pro在6月份正式推出,AR/VR/MR等头显产品也就将成为各大公司下一个重要的竞争领域,对显示屏这一关
  • 利用职权私自解除被封帐号 Meta开除20多名员工

    11月18日消息,据外媒援引知情人士表示,过去一年时间内,Facebook母公司Meta解雇或处罚了20多名员工以及合同工,指控这些人通过内部系统以不当方式重置用户帐号,其
Top