深拷贝方法

最新推荐文章于 2023-07-25 19:00:38 发布

转载最新推荐文章于 2023-07-25 19:00:38 发布 · 129 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/sweeeper/p/11082746.html

本文详细介绍了四种实现对象深拷贝的方法：通过JSON转换、使用Object.assign、深层遍历赋值以及利用ES6的扩展运算符。每种方法都有其适用场景和限制。

1.转化为字符串

2.object.assign({},obj)

3.深层遍历赋值

4.es6语法中的扩展运算符{...obj}

转载于:https://www.cnblogs.com/sweeeper/p/11082746.html

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

weixin_30546933

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

js代码-几种实现浅拷贝、深拷贝 方法

07-16

在JavaScript中，浅拷贝和深拷贝是两种常见的数据复制方法，它们在处理复杂对象时尤其重要。本文将深入探讨这两种拷贝方法，并提供不同的实现方式。 **浅拷贝（Shallow Copy）** 浅拷贝是创建一个新对象，然后将...

Python中的复制操作及copy模块中的浅拷贝与深拷贝方法

09-21

### Python中的复制操作及copy模块中的浅拷贝与深拷贝方法在Python编程中，复制操作是一项常用且重要的功能。正确理解并掌握浅拷贝和深拷贝的概念对于高效编程至关重要。本文将深入探讨Python中的复制操作以及`...

参与评论您还未登录，请先登录后发表或查看评论

深拷贝的五种实现方式

Z_J_优快云的博客

07-08

3万+

深拷贝的几种实现方式

深拷贝

shiqianhui1124的博客

05-23

5372

深拷贝 一、什么是深拷贝？（先简单理解概念） 深拷贝是指，拷贝对象的具体内容，深拷贝在计算机中开辟一块新的内存地址用于存放复制的对象。源数据改变不会影响复制的数据。二、为什么要使用深拷贝？我们希望在改变新的数组（对象）的时候，不改变原数组（对象） arr=[100,[{a:'hello'},{b:"world"}],{c:"123456789"}]; //判断修改的是不是'object'或者null,如果不是object或者null那么直接返回 f...

深拷贝的实现方式（超全）

程序员小明1024

08-31

5846

.markdown-body { line-height: 1.75; font-weight: 400; font-size: 16px; overflow-x: hidden; color: rgba(51, 51, 51, 1) } .markdown-body h1, .markdown-body h2, .markdown-body h3, .markdown-body h4, .ma...

有关实现深拷贝的四种方法

张先森的博客

04-23

5317

深拷贝与浅拷贝: 在开始之前我们需要先了解一下什么是浅拷贝和深拷贝，其实深拷贝和浅拷贝都是针对的引用类型，JS中的变量类型分为值类型（基本类型）和引用类型；对值类型进行复制操作会对值进行一份拷贝，而对引用类型赋值，则会进行地址的拷贝，最终两个变量指向同一份数据。 // 基本类型 var a = 1; var b = a; a = 2; console.log(a, b); // 2, 1 ，a b指向不同的数据 // 引用类型指向同一份数据 var a = {c: 1

深拷贝的实现方法

克里斯前端

09-11

1万+

深拷贝的实现方法

C#中4种深拷贝方法介绍

09-03

以下是对C#中四种深拷贝方法的详细说明： 1. **利用反射实现深拷贝**：反射是一种强大的工具，可以动态获取类型信息并操作对象。上述代码首先检查对象是否为字符串或值类型，如果是，则直接返回，因为这些类型...

JS实现数组深拷贝的方法分析

10-17

以下是对JS实现数组深拷贝方法的详细分析： 1. **浅拷贝**： - `slice()` 和 `concat()` 方法：这两个方法都可以实现浅拷贝，即创建一个新数组，但只复制数组的第一层元素。如果数组中包含对象或数组引用，新数组...

深拷贝实现的六种方式（优缺点浅析）

z1093541823的博客

04-14

5821

深拷贝实现的几种方式：1、通过递归方式实现深拷贝；2、JSON.parse(JSON.stringify(obj))；3、jQuery的extend方法实现深拷贝；4、Object.assign(obj1, obj2)；5、扩展运算符；6、数组使用数组方法进行深拷贝（concat、slice）...

前端：深拷贝的多种方法（超全详解）

jw_xiaoming的博客

11-24

7574

前端数据备份是我们工作中经常用到的方法，今天我带大家了解一下前端常用的深拷贝方法。

javascript的filter、map数组深浅拷贝之展开语法的奇技淫巧

热门推荐

编程知识分享，主打前端

07-17

3万+

javascript的小技巧笔记filter和mapfilter筛选数据（数据一样）map返回数组对象（长度一样）深浅拷贝浅拷贝数组的深拷贝奇淫巧计数组去重数组最大、最小数组某个值的出现次数返回两个数组的不同元素返回两个数组的相同元素 filter和map filter筛选数据（数据一样） filter不会改变原数组,返回一个新的数组 return 对true和false判断返回return true的子项不会修改原数组的子项长度：小于等于数据：子集例1： let array1=['yma1

深拷贝的方法

liu_pujun的博客

04-14

3384

一、为什么要使用深拷贝 我们希望在改变新的数组（对象）的时候，不改变原来的数组（对象） 深拷贝不会拷贝引用类型的引用，而是将引用类型的值全部拷贝一份，形成一个新的引用类型，这样就不会发生引用错乱的问题，使得我们可以多次使用同样的数据，而不用担心数据之间会起冲突。二、深拷贝的四种方法 1、使用JSON.stringify()以及JSON.parse() var obj1 = { a: 1, b: 2, c: 3 } var objString = JSON.stringify(obj1)

深拷贝的几种方法

Apeng_wjp的博客

12-13

776

一、前言：深拷贝和浅拷贝是只针对Object和Array这样的引用数据类型的。浅拷贝只复制指向某个对象的指针，而不复制对象本身，新旧对象还是共享同一块内存。但深拷贝会另外创造一个一模一样的对象，新对象跟原对象不共享内存，修改新对象不会改到原对象。二、深拷贝的几种方法。 for循环拷贝加递归，当只用for循环的时候只会拷贝单层。 function deepClone(obj) { if (typeof obj !== "object" || obj === null) {

深拷贝的常用的三种方法

weixin_49021391的博客

08-30

364

深拷贝最常用的三种方法

JS数组和对象的深拷贝方法

drakseason的博客

07-25

1435

在学习JS数组和对象的深拷贝方法前，我们必须了解JS的变量存储方式，这样才能更好的了解深浅拷贝！栈：自动分配内存空间，系统自动释放，里面存放的是基本类型的值和引用类型的地址（指针）。堆：动态分配的内存，大小不定，也不会自动释放，里面存放引用类型的值。目前只是一些比较简单的深拷贝方法，还有其他深拷贝方法，未完待续…JS 的变量存储方式：栈（stack）和堆（heap）。

javascript的深浅拷贝

qq_40535197的博客

03-12

361

首先我们要先了解： javascript的数据是如何存储的 function foo(){ let a = {title:"hello word"}; let b = a; a.title= "hi" ; console.log(a);//{title: "hi"} console.log(b);//{title: "hi"} } foo() 由上面的例子可以看出，把a赋给b，改变b的title值，同时参考文章：https://juejin.cn/post/688

关于数组和对象的深拷贝方法

混世小妲己

08-09

691

参考了阮一峰的深拷贝（阮一峰的深拷贝对数组来说，不是很严谨，会有问题，自己改进了下） <script> // 深拷贝方法 function deepCopy(data) { var c = data.constructor === Array ? [] : {}; for(var k in data) { if (typeof data[k] ===...

js深拷贝方法

最新发布

06-17

<think>我们正在回答用户关于JavaScript深拷贝方法的问题。根据引用，我们有几种不同的方法可以实现深拷贝。首先，深拷贝是指创建一个新对象，并递归地复制原始对象的所有属性，使得新对象和原始对象完全独立，修改新对象不会影响原始对象。根据引用，我们可以总结以下几种深拷贝的实现方法：1.**使用JSON序列化和反序列化**（引用[1]和引用[3]提到）：这种方法简单，但有其局限性：不能复制函数、undefined、Symbol值，以及一些特殊的对象（如Date、RegExp等）在序列化后会变成字符串，反序列化后无法还原。2.**递归实现**（引用[2]和引用[4]提到）：通过递归遍历对象的每个属性，针对不同的类型（数组、对象）进行复制。这种方法可以处理嵌套对象和数组，但同样需要特殊处理一些内置对象（如Date、RegExp等）和循环引用。3.**使用MessageChannel**（引用[3]提到）：这是一种利用异步通信API实现深拷贝的方法，可以处理一些JSON无法处理的情况（如undefined和函数），但同样不能处理函数和循环引用，而且它是异步的。由于用户没有特殊要求，我们将重点介绍前两种方法，并给出代码示例。###方法1：使用JSON序列化和反序列化```javascriptfunctiondeepClone(obj){returnJSON.parse(JSON.stringify(obj));}```**注意**：这种方法虽然简单，但有以下缺点：-忽略函数属性（因为JSON不支持函数）-忽略undefined和Symbol值-忽略对象的constructor，即原对象的原型链会丢失-不能处理循环引用（会报错）-特殊对象如Date会变成字符串，RegExp会变成空对象###方法2：递归实现（基础版）下面是一个递归实现的深拷贝函数，可以处理对象和数组的嵌套，但不处理特殊对象和循环引用。```javascriptfunctiondeepClone(obj){//如果是基本类型或null，直接返回if(obj===null||typeofobj!=='object'){returnobj;}//处理数组if(Array.isArray(obj)){constcloneArr=[];for(leti=0;i<obj.length;i++){cloneArr[i]=deepClone(obj[i]);}returncloneArr;}//处理普通对象constcloneObj={};for(letkeyinobj){if(obj.hasOwnProperty(key)){cloneObj[key]=deepClone(obj[key]);}}returncloneObj;}```###方法3：递归实现（增强版）为了处理更多的内置对象和循环引用，我们可以增强递归实现：```javascriptfunctiondeepClone(obj,hash=newWeakMap()){//如果是基本类型或null，直接返回if(obj===null||typeofobj!=='object'){returnobj;}//如果已存在循环引用，则直接返回存储的值if(hash.has(obj)){returnhash.get(obj);}//处理Date对象if(objinstanceofDate){constcopy=newDate(obj);hash.set(obj,copy);returncopy;}//处理RegExp对象if(objinstanceofRegExp){constcopy=newRegExp(obj.source,obj.flags);hash.set(obj,copy);returncopy;}//处理数组if(Array.isArray(obj)){constcloneArr=[];hash.set(obj,cloneArr);for(leti=0;i<obj.length;i++){cloneArr[i]=deepClone(obj[i],hash);}returncloneArr;}//处理普通对象constcloneObj=Object.create(Object.getPrototypeOf(obj));hash.set(obj,cloneObj);for(letkeyinobj){if(obj.hasOwnProperty(key)){cloneObj[key]=deepClone(obj[key],hash);}}returncloneObj;}```这个增强版函数通过使用WeakMap来存储已经拷贝过的对象，解决了循环引用的问题，并增加了对Date和RegExp对象的支持。但是，函数属性仍然被直接返回（因为函数是基本类型？不，函数是对象，但这里我们按基本类型处理？不对，函数在JavaScript中是对象，但通常我们不希望复制函数，因为函数是共享的）。因此，这个函数不会复制函数，但会复制其他可枚举属性。###其他方法除了上述方法，还可以使用第三方库（如lodash的`_.cloneDeep`）来实现深拷贝，这些库通常处理了更多边界情况。###总结-对于简单对象（没有函数、循环引用和特殊对象），可以使用`JSON.parse(JSON.stringify(obj))`。-对于复杂对象，建议使用递归实现，并考虑循环引用和特殊对象。-在实际项目中，使用成熟的库（如lodash）是更可靠的选择。§§相关问题§§1.深拷贝和浅拷贝有什么区别？2.如何实现一个处理循环引用的深拷贝函数？3.使用JSON方法实现深拷贝有什么局限性？4.在JavaScript中，如何复制一个包含函数的对象？5.第三方库（如lodash）是如何实现深拷贝的？</think>### JavaScript 深拷贝实现方法详解在 JavaScript 中实现深拷贝的核心是**创建独立的内存空间**，递归复制所有嵌套属性。以下是几种常用方法及原理分析： #### 方法1：JSON 序列化法（简单场景） ```javascript function deepClone(obj) { return JSON.parse(JSON.stringify(obj)); } ``` **原理**：通过 `JSON.stringify()` 将对象转为字符串，再用 `JSON.parse()` 重建新对象。 ✅ 优点：代码简洁 ❌ 缺点： - 无法复制 `函数`、`undefined`、`Symbol` 类型 - 会丢失 `Date` 对象（转为字符串） - 无法处理 `循环引用`（如 `obj.self = obj`） #### 方法2：递归实现（基础版） ```javascript function deepClone(obj) { if (obj === null || typeof obj !== 'object') { return obj; // 基本类型直接返回 } const cloneObj = Array.isArray(obj) ? [] : {}; for (let key in obj) { if (obj.hasOwnProperty(key)) { cloneObj[key] = deepClone(obj[key]); // 递归复制嵌套属性 } } return cloneObj; } ``` **适用场景**：处理普通对象和数组的嵌套结构，如： ```javascript const original = { a: 1, b: { c: [2, 3] } }; const cloned = deepClone(original); console.log(cloned.b.c === original.b.c); // false（深拷贝成功） ``` #### 方法3：增强递归版（支持特殊类型） ```javascript function deepClone(obj, hash = new WeakMap()) { if (obj === null) return null; if (typeof obj !== 'object') return obj; if (obj instanceof Date) return new Date(obj); // 处理Date if (obj instanceof RegExp) return new RegExp(obj); // 处理正则 if (hash.has(obj)) return hash.get(obj); // 解决循环引用 const cloneObj = new obj.constructor(); hash.set(obj, cloneObj); for (let key in obj) { if (obj.hasOwnProperty(key)) { cloneObj[key] = deepClone(obj[key], hash); } } return cloneObj; } ``` ✅ 增强功能： 1. 支持 `Date`、`RegExp` 等内置对象 2. 通过 `WeakMap` 解决循环引用问题 3. 保持原型链 (`new obj.constructor()`) #### 方法4：MessageChannel API（异步深拷贝） ```javascript function deepClone(obj) { return new Promise(resolve => { const { port1, port2 } = new MessageChannel(); port2.onmessage = ev => resolve(ev.data); port1.postMessage(obj); }); } // 使用示例 deepClone(obj).then(clone => { console.log(clone); }); ``` **特点**： - 可复制 `undefined` 和函数（但函数会丢失原型链） - 异步操作，适合复杂对象 - 仍无法解决循环引用 #### 方法对比表 | 方法 | 函数支持 | 循环引用 | 特殊类型 | 性能 | |--------------------|----------|----------|----------|--------| | JSON法 | ❌ | ❌ | ❌ | ⭐⭐⭐⭐ | | 基础递归 | ✅ | ❌ | ❌ | ⭐⭐⭐ | | 增强递归 | ✅ | ✅ | ✅ | ⭐⭐ | | MessageChannel | ✅ | ❌ | ✅ | ⭐ | #### 最佳实践建议 1. 简单对象 → **JSON法**（最快） 2. 含函数/嵌套对象 → **增强递归版** 3. 超大对象 → 考虑 **lodash.cloneDeep**（库函数优化过性能） 4. 避免深拷贝场景 → 使用不可变数据结构（如Immer.js） > 示例库实现参考：lodash 的 [_.cloneDeep](https://lodash.com/docs/4.17.15#cloneDeep) 使用组合式类型检测和递归，支持超过20种特殊对象类型[^2]。