千锋教育-做有情怀、有良心、有品质的职业教育机构

手机站
千锋教育

千锋学习站 | 随时随地免费学

千锋教育

扫一扫进入千锋手机站

领取全套视频
千锋教育

关注千锋学习站小程序
随时随地免费学习课程

当前位置:首页  >  技术干货  > JavaScript 对象数组的深浅拷贝

JavaScript 对象数组的深浅拷贝

来源:千锋教育
发布人:zyh
时间: 2023-06-29 16:46:00 1688028360

  在 JavaScript 中,对象数组的拷贝涉及到深拷贝和浅拷贝的概念。下面简要介绍这两种拷贝方式:

JavaScript 对象数组的深浅拷贝

  1. 浅拷贝:

  - 浅拷贝是指创建一个新的对象或数组,新对象的属性值是对原始对象属性的引用。也就是说,新对象和原始对象的某些属性引用相同的内存地址。

  - 对于对象数组的浅拷贝,可以使用扩展运算符 `...` 或 `Array.from()` 方法。  

const originalArray = [{ name: "John" }, { name: "Jane" }];

// 使用扩展运算符进行浅拷贝
const shallowCopyArray1 = [...originalArray];
shallowCopyArray1[0].name = "Mike";
console.log(originalArray[0].name); // 输出: Mike

// 使用 Array.from() 进行浅拷贝
const shallowCopyArray2 = Array.from(originalArray);
shallowCopyArray2[1].name = "Lily";
console.log(originalArray[1].name); // 输出: Lily

  2. 深拷贝:

  - 深拷贝是指创建一个全新的对象或数组,新对象和原始对象完全独立,不存在属性引用共享的情况。

  - 对于对象数组的深拷贝,可以使用 JSON 序列化和反序列化方法,即 `JSON.stringify()` 和 `JSON.parse()`。  

const originalArray = [{ name: "John" }, { name: "Jane" }];

// 使用 JSON 序列化和反序列化进行深拷贝
const deepCopyArray = JSON.parse(JSON.stringify(originalArray));
deepCopyArray[0].name = "Mike";
console.log(originalArray[0].name); // 输出: John

  需要注意的是,使用 JSON 序列化和反序列化方法进行深拷贝时,有一些限制:

  - 无法复制函数、正则表达式等特殊对象。

  - 无法处理循环引用的情况。

  如果需要处理更复杂的对象结构或者遇到上述限制,可以考虑使用第三方库(如 lodash 的 `cloneDeep` 方法)来实现更可靠的深拷贝。

声明:本站稿件版权均属千锋教育所有,未经许可不得擅自转载。
10年以上业内强师集结,手把手带你蜕变精英
请您保持通讯畅通,专属学习老师24小时内将与您1V1沟通
免费领取
今日已有369人领取成功
刘同学 138****2860 刚刚成功领取
王同学 131****2015 刚刚成功领取
张同学 133****4652 刚刚成功领取
李同学 135****8607 刚刚成功领取
杨同学 132****5667 刚刚成功领取
岳同学 134****6652 刚刚成功领取
梁同学 157****2950 刚刚成功领取
刘同学 189****1015 刚刚成功领取
张同学 155****4678 刚刚成功领取
邹同学 139****2907 刚刚成功领取
董同学 138****2867 刚刚成功领取
周同学 136****3602 刚刚成功领取
相关推荐HOT