JavaScript 深浅 复制

1年前 (2023-09-06)阅读68回复0
优学习
优学习
  • 注册排名10009
  • 经验值0
  • 级别
  • 主题0
  • 回复0
楼主
JavaScript 深浅复制 JavaScript是一种非常流行的编程语言,在Web开发中使用广泛。虽然它是一种灵活的编程语言,但这也使它极容易出现数据复制问题,特别是在对象和数组的复制中。JavaScript 中有 “浅复制” 和 “深复制” 的概念,让我们看看它们之间的差异。 浅复制 简单来说,浅复制只创建对象的一个副本,而不是对象内部的所有数据。在JavaScript中,我们通常使用“Object.assign()”函数来实现浅复制。例如:
let source = { name: 'Tom', age: 24, address: { city: 'LA', state: 'CA' } };
let shallowCopy = Object.assign({}, source); 
console.log(shallowCopy);
在此示例中,我们使用Object.assign()函数将“source”对象浅复制到“shallowCopy”对象中。现在,“shallowCopy”对象与“source”对象具有相同的属性和值。因此,我们可以使用以下代码来判断它们是否相等:
console.log(source === shallowCopy);  // false
console.log(source.name === shallowCopy.name);  // true
console.log(source.address === shallowCopy.address); // true
我们发现,浅复制只复制了第一层对象及其属性,但是“address”属性引用的第二层对象只是引用了原始对象的引用,这就是它们仍然引用相同内存地址的原因。 深复制 深复制是递归地将一个对象及其子对象完全复制的过程。当我们修改副本对象时,不会影响到原始对象。为了实现深复制,我们可以递归地复制每个对象属性并将其分配给新对象。
function deepCopy(object) {
let result = {};
for(let key in object) {
if(typeof object[key] === 'object') {
result[key] = deepCopy(object[key]); // 使用递归
} else {
result[key] = object[key];
}
}
return result;
}
let source = { name: 'Tom', age: 24, address: { city: 'LA', state: 'CA' } };
let deepCopy = deepCopy(source);
console.log(deepCopy);
在这个例子中,我们创建了一个递归函数,该函数遍历每个属性并为每个属性创建新的对象引用。由于我们使用递归,因此我们可以深入了解更深层次的对象属性。deepCopy()函数将“source”对象深复制到“deepCopy”对象中。现在,“deepCopy”和“source”两个对象在内存中是独立的,我们可以改变一个对象而不影响另一个对象。
source.name = 'Jerry';
source.address.city = 'San Fransisco';
console.log(source);
console.log(deepCopy);
在上面的示例中,我们更改了“source”和“source.address”对象的属性,在浅复制中,“shallowCopy”对象的“address”属性也会更改,但在深复制中,“deepCopy”对象的“address”属性不会更改,因为这是一个完全独立的对象。 总结 浅复制和深复制是JavaScript中让我们决定复制策略的两个选项。浅复制只复制对象的属性,而不复制它们内部引用的其他子对象,而深复制会完全递归复制对象及其所有子对象。如果我们需要“只是”复制一个对象的几个属性,那么浅复制就足够了,但是如果我们需要完全复制一个对象及其所有子对象,则应使用深复制。

本文可能转载于网络公开资源,如果侵犯您的权益,请联系我们删除。

本文地址:https://www.pyask.cn/info/1225.html

0
回帖

JavaScript 深浅 复制 期待您的回复!

取消
载入表情清单……
载入颜色清单……
插入网络图片

取消确定

图片上传中
编辑器信息
提示信息