JS数组复制或克隆新数组修改不影响原数组

最新推荐文章于 2023-11-24 19:24:49 发布
最新推荐文章于 2023-11-24 19:24:49 发布
阅读量3.9k 收藏 9
点赞数 10
CC 4.0 BY-SA版权
分类专栏： 个人BUG集
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_40310480/article/details/102941672
本文介绍了一个有效避免在修改数组时产生冲突的方法，通过将数组转化为JSON字符串再解析回来，实现深拷贝，确保原数组与修改后的数组相互独立。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

再做一个小游戏,需求是当前数组修改前需要记录下当前的内容,网上搜了一堆,还有什么W3C的,一个都用不了,都是同时修改,

let arr = [1,2,3,];
let arr1 = arr.clone();

let arr1 = arr.concat();

let arr1 = arr.slice();
又或者遍历直接插进去:
arr .forEach(item => {
arr1 .push(item);
})

全部都不行,最后发现一个可以改变引用的神器!
JSON.stringify( arr );
JSON.parse( arr );

先把数组转成Json再转回去,先转再转就可以完美避开同时修改的问题了!

let arr1  = JSON.parse(JSON.stringify(arr));
javascript数组克隆简单实现方法
10-23
但是需要注意的是，如果原数组中包含对象或数组，那么这些元素在新数组中仍然通过引用赋值，因此对象的修改会影响到原数组。 接下来提到的是`slice`方法。`slice`方法可以接受一个或两个参数，分别代表开始和结束的...
js 数组克隆方法 小结
10-29
在JavaScript中，处理数组时经常需要创建数组的副本，即克隆数组。由于JavaScript数组是对象类型的一种，其赋值和操作具有特殊性。当我们对数组进行赋值操作时，并非复制数组本身，而是复制对数组的引用。这就意味着...
JavaScript中复制新的数组与原数组删除某个值——不影响新复制的数组的方法详解
pleaseprintf的博客
07-31 1293
在JavaScript中，我们经常需要处理数组的复制和修改。本文将详细介绍如何在JavaScript中复制一个新的数组，并在原数组删除某个值的情况下，确保新复制的数组值不受影响。通过丰富的示例代码，你将掌握多种方法来实现这一需求。通过本文，你学会了在JavaScript中复制一个新的数组，并在原数组删除某个值的情况下，确保新复制的数组值不受影响的多种方法。你可以根据实际需求选择合适的方法来处理数组操作。希望本文对你有所帮助。如果你有任何问题或疑问，欢迎留言讨论。需要系统源码或者BiShe加V。
JavaScript中如何复制对象和数组，使其在数据变得后不影响原数据属性或元素的变化
最新发布
m0_59076644的博客
11-24 939
要解决这个问题，你可以使用一些方法来创建对象的副本，确保修改副本对象的属性不会影响源对象的属性。这些方法都可以创建原始数组的副本，确保修改副本数组中的对象不会影响原始数组中的对象。根据你的需求选择适合的方法即可。如果你想修改数组中的对象，而不影响原始对象，可以使用类似的方法来创建数组的副本。
Array copyWithin()方法浅复制数组的一部分到同一数组中的另一个位置，并返回它，不会改变原数组的长度。
sunluyi的博客
12-11 423
copyWithin()方法浅复制数组的一部分到同一数组中的另一个位置，并返回它，不会改变原数组的长度。 //数组实例的copyWithin方法，在当前数组内部，将指定位置的成员复制到其他位置（会覆盖原有成员），然后返回当前数组。也就是说，使用这个方法，会修改当前数组。 var arr = ['索引0','索引1','索引2','索引3','索引4']; /* copyWithin(targe...
js对象传递踩坑 数组复制 不影响原有数据
weixin_43193323的博客
04-20 679
需求： var a = [1,2,3,4,5,5,6,7]; var b = a; var max = Math.max.apply(null, b); var min = Math.min.apply(null, b); //去掉最大值最小值 delitem(b,max); delitem(b,min); console.log(a);//[2,3,4,5,5,6]; console.log(b...
js引用复制如何改变复制数组不改变原数组
衣乌安、随笔
08-18 1万+
我们需要知道的是object和array类型的变量为引用类型，也就是说其存储的实际上并不是具体的值而是一个指向堆内存的地址。 因此当我们把一个引用类型如‘数组’，赋值给另一个变量时，实际上是把另一个变量指向了与之相同的地址，当我们改变其中一个时，实际上改变了堆内存中的存储内容　，相应的所有指向该地址的数组都发生了变化： 有时我们并不想要类似的事情发生要如任何解决呢？下面介绍两种简单的方法 ...
Javascript中克隆一个数组的实现代码
10-26
数组克隆是数组操作中的一项基础技能，它在实际编程中应用广泛，如需要修改原数组副本而不影响原数组，或者是在函数参数传递中需要一个数组的副本时。 对于数组的克隆，在JavaScript中有多种方法可以实现： 1. ...
JavaScript 克隆数组最简单的方法
10-30
在JavaScript中，数组克隆是将一个数组复制成一个新的独立的数组，修改克隆后的数组不会影响原始数组。这是在处理复杂数据结构时非常重要的一个概念，特别是在涉及到深层拷贝和浅层拷贝的问题上。本文将深入探讨...
js克隆对象、数组的常用方法介绍
12-02
在JavaScript中，克隆对象和数组是常见的需求，特别是在处理数据的复制、备份或避免原始数据被意外修改时。以下是一些常用的克隆方法： 1. **Ext的克隆方法**： - `Ext.clone(json)`：这个方法是ExtJS框架提供的，...
Js如何实现对数组复制而不影响原数组
AzeShinja的博客
09-22 3942
在JS中基本类型可以直接赋值， 在更改新的值后 并不会影响原来的值 可是如果是数组操作就比如: let arr = [1,2,3,4]; let arr1 = []; arr1 = arr; arr1.push(5); console.log(arr + "---" + arr1); 输出的结果就会发现他们的值都改变了, 变为 [1, 2, 3, 4, 5]; 所以我们要用别的操作来弥补， 不能让他更改原来的值 所以我们可以： arr1 = arr.slice(0); 这只是其中一种最方便的方法， .
数组有哪些方法
weixin_49333876的博客
02-10 360
数组有哪些方法 一、操作方法 1、增 （1）：push()添加到数组末尾任意或多个值 <script> var getNumber=[1,2,3,4]; getNumber.push(5,6,7); console.log(getNumber); // 那么打印出来的getNumber就是[1,2,3,4,5,6,7] </script> （2）：unshift() 添加任意多个值在数组的头部 <scri
【js】JS数组复制或克隆新数组修改不影响原数组
Mrerlou的博客
09-15 4232
前言 有个需求，在修改记录前需要记录下原来的数组内容，为了后续恢复。 准备 网上的很多方法都试过不行，例如。 et arr = [1,2,3,]; let arr1 = arr.clone(); let arr1 = arr.concat(); let arr1 = arr.slice(); 又或者遍历直接插进去: arr .forEach(item => { arr1 .push(item); }) 至于说为什么： 数组存储对象都是存地址的，所以浅复制会导致 a 和 b 指向同一块内存地址；
jquery复制克隆元素，复制div，复制tabel等元素，不影响原先元素
j18423532754的博客
12-10 3355
我们在写网页时，经常遇到，我们需要弹出的弹出框是网页上某一个div或者整个table。 当我们取出网页上元素的时候，然后装到弹出框或者其他网页上的其他的地方的时候我们发现 原先的元素不见了，然后整个布局都变了。我们就想，能不能复制的时候，只是复制，而不是复制后，原先的元素受到影响。 比如。A网页上的一个div，在E地方。我们想复制这个div在A网页上的F地方。或者弹出框G地方 这时候我们就...
jQuery复制数组
m0_37780367的博客
08-16 2680
复制一份数组的数据，赋值给另一个数组 var copyArr = $.extend(true, [], that.flatdata); console.log('copyArr>>>>'); console.log(copyArr);
JS在不改变原数组的情况下复制一个新的数组
weixin_30477293的博客
10-26 2778
var a={1,2,3,4} var data= JSON.parse(JSON.stringify(a[0])) a.push(data) a[4]=5 这样就不会改变原数组a的数据 转载于:https://www.cnblogs.com/mywangpingan/p/9853792.html
数组复制更改，原数组不被改变的方法
hehedalinzi的博客
09-25 1920
数组复制更改，原数组不被改变的方法 let val = [1,2,3]; let tiem = JSON.parse(JSON.stringify(val)); item 的改变不影响原数组
js 数组常用方法，数组的拷贝（不影响原数组），数组相等
热门推荐
lance的进击之路
07-17 2万+
js数组常用方法，易错点总结。数组独立拷贝；数组相等的判定；
JavaScript将一个数组插入到另一个数组的方法
奋斗在前端的实习生
04-01 2197
var a = [4,5,6]; var b = [7,8,9]; Array.prototype.push.apply(a, b); uneval(a); // is: [4, 5, 6, 7, 8, 9]
js数组复制但不会影响原数组
08-19
在JavaScript中，想要复制一个数组但不会影响原数组可以使用深拷贝的方式。深拷贝是指创建一个新的数组并将原数组的每个元素逐个复制到新数组中，而不是简单地复制引用。这样做可以确保修改新数组不会影响原数组。 有几种方法可以实现数组的深拷贝。其中一种方法是使用JSON.parse和JSON.stringify函数。你可以先将原数组转换为JSON字符串，然后再将JSON字符串转换回数组。这样做会创建一个新的数组，其中的元素是原数组的副本，而不是引用。 另一种方法是使用循环来逐个复制原数组的元素到新数组中。你可以创建一个空数组，然后使用forEach或for循环遍历原数组，将每个元素复制到新数组中。 请注意，如果数组中的元素也是引用类型，那么这些元素仍然会被复制为引用。如果你想要对这些元素进行深拷贝，需要对每个元素都进行相应的复制。 下面是一个使用JSON.parse和JSON.stringify函数进行数组深拷贝的示例代码： ``` const arr = [1, 2, 3]; const arrCopy = JSON.parse(JSON.stringify(arr)); ``` 这样，arrCopy就是arr的一个深拷贝，对arrCopy的修改不会影响到arr。 另外，还有其他方法可以实现数组的深拷贝，比如使用第三方库lodash的cloneDeep方法。不同的方法适用于不同的场景，你可以根据自己的需求选择最适合的方法进行数组的复制。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* [JavaScript 数组的深度复制解析](https://download.csdn.net/download/weixin_38611812/14807962)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *2* *3* [【js】JS数组复制或克隆新数组修改不影响原数组](https://blog.csdn.net/Mrerlou/article/details/120306960)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]
评论 8
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值