浅谈JavaScript中的对象赋值

目录

常见的对象赋值方式

直接赋值和对象扩展（浅拷贝）两种赋值方式区别

区别

联系

---

常见的对象赋值方式

1. 直接赋值：this.info = this.deviceInfo，将一个对象的引用赋给另一个变量，它们引用同一个对象。

2. 对象扩展（浅拷贝）：this.info = {...this.deviceInfo}，使用对象扩展语法创建一个新对象，包含原对象的所有属性和值，但是它们引用不同的对象。

3. Object.assign() 方法（浅拷贝）：this.info = Object.assign({}, this.deviceInfo)，使用 Object.assign() 方法将一个或多个源对象的属性复制到目标对象，也是实现浅拷贝的一种方式。

4. JSON.parse() 和 JSON.stringify()（深拷贝）：通过将对象转换为JSON字符串再解析回对象的方式，可以实现深拷贝，但是有一些限制，例如无法复制函数等特殊属性。

这些是常见的对象赋值方式，每种方式都有不同的特点和适用场景。

直接赋值和对象扩展（浅拷贝）两种赋值方式区别

区别

1. 引用 vs 新对象:

• this.info = this.deviceInfo: 这种方式是引用赋值。this.info 和 this.deviceInfo 指向同一个对象。因此，对任一变量所做的修改都会影响到另一个，因为它们共享同一个内存地址。

• this.info = {...this.deviceInfo}: 这种方式是浅拷贝。使用对象扩展语法 {...} 创建了一个新的对象，它具有与原始对象 this.deviceInfo 相同的顶层属性。但是，这两个对象是独立的，对 this.info 的修改不会影响 this.deviceInfo。

2. 深度拷贝与浅拷贝:

• this.info = this.deviceInfo: 不涉及拷贝，只是引用。

• this.info = {...this.deviceInfo}: 浅拷贝。如果 this.deviceInfo 的属性中包含其他对象或数组，这些属性在 this.info 中仍然是引用，不是独立的拷贝。

联系

• 目的相同：两种方式都用于将 this.deviceInfo 的内容以某种形式赋给 this.info。

• 语法简洁：都是通过简单的赋值语句完成，易于编写和理解。

• 使用场景：选择使用哪种方式取决于是否需要原始数据的独立副本。如果需要独立操作数据而不影响原始数据，应选择浅拷贝或深拷贝；如果只是想共享同一数据集，可以使用引用赋值。

总结来说，选择哪种赋值方式取决于你的具体需求，是否需要数据之间的独立性。