js数组深拷贝汇总

1.for 循环实现数组的深拷贝

通过对数组的for循环,即可实现对数组的深拷贝了。

javascript 复制代码
var arr = [1,2,3,4,5]
var arr2 = copyArr(arr)
function copyArr(arr) {
    let res = []
    for (let i = 0; i < arr.length; i++) {
    res.push(arr[i])
    }
    return res
}

2.slice 方法实现数组的深拷贝

将原数组中抽离部分出来形成一个新数组。我们只要设置为抽离全部,即可完成数组的深拷贝。

javascript 复制代码
var arr = [1,2,3,4,5]
var arr2 = arr.slice(0)
arr[2] = 5
console.log(arr)
console.log(arr2)
// 输出arr为  [1, 2, 5, 4, 5]
// 输出arr2为 [1, 2, 3, 4, 5]

3.concat 方法实现数组的深拷贝

用于连接多个数组组成一个新的数组的方法。那么,我们只要连接它自己,即可完成数组的深拷贝。

javascript 复制代码
var arr = [1,2,3,4,5]
var arr2 = arr.concat()
arr[2] = 5
console.log(arr)
console.log(arr2)
// 输出arr为  [1, 2, 5, 4, 5]
// 输出arr2为 [1, 2, 5, 4, 5]

4.使用JSON.parse()和JSON.stringify()

javascript 复制代码
const arr1 = [1, 2, 3, 4];
const arr2 = JSON.parse(JSON.stringify(arr1));

5. 使用Array.from()

javascript 复制代码
const arr1 = [1, 2, 3, 4];
const arr2 = Array.from(arr1);

6.使用Array.map()

javascript 复制代码
const arr1 = [1, 2, 3, 4];
const arr2 = arr1.map(item => item);

7.ES6扩展运算符实现数组的深拷贝

javascript 复制代码
var arr = [1,2,3,4,5]
var [ ...arr2 ] = arr
arr[2] = 5
console.log(arr)
console.log(arr2)
// 输出arr为  [1, 2, 5, 4, 5]
// 输出arr2为 [1, 2, 5, 4, 5]
相关推荐
前端小趴菜0514 分钟前
React-React.memo-props比较机制
前端·javascript·react.js
摸鱼仙人~1 小时前
styled-components:现代React样式解决方案
前端·react.js·前端框架
sasaraku.2 小时前
serviceWorker缓存资源
前端
iCxhust2 小时前
c# U盘映像生成工具
开发语言·单片机·c#
RadiumAg3 小时前
记一道有趣的面试题
前端·javascript
yangzhi_emo3 小时前
ES6笔记2
开发语言·前端·javascript
yanlele3 小时前
我用爬虫抓取了 25 年 5 月掘金热门面试文章
前端·javascript·面试
emplace_back4 小时前
C# 集合表达式和展开运算符 (..) 详解
开发语言·windows·c#
jz_ddk4 小时前
[学习] C语言数学库函数背后的故事:`double erf(double x)`
c语言·开发语言·学习
萧曵 丶4 小时前
Rust 所有权系统:深入浅出指南
开发语言·后端·rust