​​​​​​ 1.JavaScript中的浅拷贝对象

2.深度复制JavaScript中的对象

各种编程语言具有各种数据结构,允许你在内存中组织和存储数据。每个数据结构的工作方式都是独一无二的。例如,在 C++ 和 Java 中,我们有 Hashmap 以键值形式存储数据。同样,在 JavaScript 中,我们有一个称为对象的数据结构,它允许你以键值格式存储数据。

在访问数据时,这些对象会派上用场。我们可以使用对象的键轻松访问对象中的任何数据。在本文中,我们将看到在 JavaScript 中复制对象的各种方式。

请注意 JavaScript 对象是可变的,并且存储为引用。如果你已经创建了一个对象并希望将其分配给其他某个对象,那么该对象现在将保存该对象的地址。由于我们将对象的引用存储在另一个对象中,然后使用这个新对象,我们可以轻松地更改原始对象中存在的值。

var a = {"name": "Adam","company": "Google"
}var b = a;
b.name = "Sam"console.log(a.name, b.name);

输出:

Sam Sam

从上面的示例中可以看出,将一个对象分配给另一个对象不会复制对象本身。它只会将旧对象的地址存储到新对象中。

在 JavaScript 中有两种复制对象的方法。一种方式称为浅拷贝,另一种方式称为深拷贝。为了实现这些方法,我们可以使用一些 JavaScript 方法,如下所示。

JavaScript中的浅拷贝对象

从上面的示例中可以看出,将一个对象分配给另一个对象不会复制对象本身。它只会将旧对象的地址存储到新对象中。

var obj1 = {"firstName": "James","lastName": "Bond","films": ["No Time To Die","Spectre","Skyfall","Quantum of Solace"],"actors":{"characters": {"realName": "Daniel Craig","fakeName": "James Bond"}}
}

在这个例子中,我们有一个名为 obj1 的对象。要使用 JavaScript 对这个对象进行浅拷贝,我们可以使用 Object.assign() 和扩展运算符 ...。让我们使用 JavaScript 中的以下方法对 obj1 执行浅拷贝。

  1. Object.assign() 方法

Object.assign() 方法有两个参数。第一个参数是复制完成后将返回的 target 对象。第二个参数是我们要复制的对象:obj1。在我们的例子中,我们将传递一个空对象 {} 作为目标。这是因为 obj1 中的所有元素都将被复制到这个空对象中。复制完成后,Object.assign() 将返回我们将存储在 obj2 变量中的新对象。

var obj2 = Object.assign({}, obj1);
obj2.firstName = "Camila";
obj2.films[0] = "abcccc";
obj2.actors.characters.realName = "Camila";console.log(obj1);
console.log(obj2);

在这里,我们使用 obj2、firstNamefilms[] 数组中的第一部电影和 actors.characters 对象中的 realName 属性更改三个值。然后我们打印这两个对象。

在 JavaScript 中复制对象相关推荐

  1. JavaScript 中的对象拷贝(深拷贝、浅拷贝)

    对象是 JavaScript 的基本块.对象是属性的集合,属性是键值对.JavaScript 中的几乎所有对象都是位于原型链顶部 Object 的实例. 介绍 如你所知,赋值运算符不会创建一个对象的副 ...

  2. Javascript中的对象拷贝(对象复制/克隆)

    Javascript中的对象拷贝(对象复制/克隆) 李俊才 CSDN:jcLee95 邮箱:291148484@163.com 1. 对象的引用 要说"拷贝"还要先说"引 ...

  3. JavaScript中的对象比较[重复]

    本文翻译自:Object comparison in JavaScript [duplicate] This question already has answers here : 这个问题已经在这里 ...

  4. JavaScript中deferred对象浅析

    JavaScript中deferred对象浅析 一.deferred对象 1.1deferred对象 1.1.1基本概念 deferred对象是JQuery的回调函数解决方案,解决了如何处理耗时操作的 ...

  5. JavaScript中Object对象方法超详细讲解举例说明仅此一篇

    JavaScript中Object对象方法超详细讲解举例说明仅此一篇 Object.assign() Object.create() Object.values() Object.entries() ...

  6. 创建健壮的isArray()函数(JavaScript中判断对象类型的种种方法)

    我们知道,JavaScript中检测对象类型的运算符有:typeof.instanceof,还有对象的constructor属性: 1) typeof 运算符 typeof 是一元运算符,返回结果是一 ...

  7. 在JavaScript中删除对象

    本文翻译自:Deleting Objects in JavaScript I'm a bit confused with JavaScript's delete operator. 我对JavaScr ...

  8. 如何在Javascript中访问对象的第一个属性?

    本文翻译自:How to access the first property of an object in Javascript? Is there an elegant way to access ...

  9. 检查值是否是JavaScript中的对象

    如何检查值是否是JavaScript中的Object? #1楼 尝试这个 if (objectName instanceof Object == false) {alert('Not an objec ...

最新文章

  1. Windows10上使用VS2017编译OpenCV3.4.2+OpenCV_Contrib3.4.2+Python3.6.2操作步骤
  2. leetcode算法题--Integer to Roman
  3. 卫星导航 | 整秒转时分秒(时间转换)
  4. 什么是回调地狱以及promise的链式调用和aysnc/await
  5. 【GIF动画+完整可运行源代码】C++实现 基数排序——十大经典排序算法之十
  6. 互联网+激发连锁酒店竞争意识 OTA遭遇对抗危机
  7. 都灵JVM编程语言:使用ANTLR构建高级词法分析器
  8. C# DataTable 和List之间相互转换的方法
  9. 【赛时总结】 ◇赛时·II◇ AtCoder ABC-100
  10. 微信公号“架构师之路”学习笔记(四)-分布式ID生成算法(应用场景、uuid/guid、snowflake算法)
  11. html 边框轮廓,CSS Outline(轮廓)
  12. 项目背景怎么描述_项目工作总结报告怎么写?搞定通用规范模型先
  13. 数据结构1——堆栈和队列
  14. 生活广场远程预付费电能管理系统的设计与应用
  15. LT培训Hadoop
  16. 树莓派3B 之IIC通信
  17. 理解 alter table nologging
  18. gazebo无人机仿真显示:failsafe enabled: no rc
  19. halcon算法库中各坐标系,位姿的解释及原理
  20. 抖音广告多少种,这些你知道吗?

热门文章

  1. 计算机二级开封大学通过率,考生注意:河南这所学校专科层次,本科名字,千万不要弄错...
  2. 【多线程】线程的引入,创建线程的方式,设置线程名字、获取名字,线程优先级priority,加入休眠的方法,,后台线程,礼让线程,Join,中断线程,某电影院,共有100张票线程流程图,3售票窗口,
  3. html5表格标题大小,lt;captiongt; - 表格标题 - html5表格内容
  4. MDC300F MDS新建工程 GPIO
  5. 奖品免费送,为什么用户激励还是不起作用?
  6. 猿辅导大数据校招1面+2面面经
  7. 2020-08-04:神州数码面试题
  8. Java BigDecimal 比较大小
  9. js递归函数递归思想
  10. 如何入门网络安全_网络安全自学