在 JavaScript 中复制对象

本文探讨了JavaScript中对象复制的概念,包括可变性和引用存储。通过示例展示了浅拷贝(如使用`Object.assign()`和扩展运算符`...`)如何影响对象,并解释了深拷贝的必要性。文章还提供了浅拷贝的实现方法,以及当对象包含嵌套结构时可能出现的问题。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

​​​​​​ 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 属性更改三个值。然后我们打印这两个对象。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值