PHP前端开发

JavaScript 中的浅复制与深复制

百变鹏仔 3天前 #JavaScript
文章标签 JavaScript

使用 javascript 时,了解浅复制和深复制之间的区别对于有效操作对象和数组至关重要。让我们深入研究这些术语的含义以及如何在代码中实现每种类型的副本。

浅复制
浅拷贝创建一个新的对象或数组,其中包含与原始对象或数组相同的值。但是,如果原始文件包含嵌套对象或数组,则浅拷贝仅复制对这些嵌套结构的引用,而不复制结构本身。这意味着对复制结构中的嵌套对象或数组的更改也会影响原始结构。

浅复制方法示例:

  1. 扩展运算符 ({...})
const original = { a: 1, b: { c: 2 } };const shallowcopy = { ...original };

这里,shallowcopy是一个新对象,但是shallowcopy.b仍然引用与original.b相同的对象。

2.object.assign()

const shallowcopy = object.assign({}, original);
  1. 数组切片方法
const originalarray = [1, 2, 3];const shallowcopyarray = originalarray.slice();

深复制
深层复制创建一个新的对象或数组,它是原始对象或数组的完整、独立的克隆,包括所有嵌套的对象和数组。对深层副本的更改不会影响原始副本,反之亦然。

深复制方法示例:

立即学习“Java免费学习笔记(深入)”;

  1. json.stringify() 和 json.parse()
const original = { a: 1, b: { c: 2 } };const deepcopy = json.parse(json.stringify(original));

该方法将对象序列化为 json 字符串,然后将其解析回新对象。但是,它不处理函数、未定义或循环引用。

2.递归函数

function deepcopy(obj) {  if (obj === null || typeof obj !== 'object') return obj;  const copy = array.isarray(obj) ? [] : {};  for (let key in obj) {    if (obj.hasownproperty(key)) {      copy[key] = deepcopy(obj[key]);    }  }  return copy;}
  1. structuredclone()(在现代 javascript 环境中)
const deepCopy = structuredClone(original);

何时使用每个

了解这些差异有助于防止意外共享引用引起的错误,并确保应用程序中的数据完整性