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]
相关推荐
虾球xz8 分钟前
CppCon 2018 学习:THE MOST VALUABLE VALUES
开发语言·c++·学习
掘金安东尼11 分钟前
前端周刊第421期(2025年7月1日–7月6日)
前端·面试·github
摸鱼仙人~14 分钟前
深入理解 classnames:React 动态类名管理的最佳实践
前端·react.js·前端框架
未来之窗软件服务16 分钟前
chrome webdrive异常处理-session not created falled opening key——仙盟创梦IDE
前端·人工智能·chrome·仙盟创梦ide·东方仙盟·数据调式
kymjs张涛16 分钟前
零一开源|前沿技术周报 #6
前端·ios·harmonyos
玲小珑20 分钟前
Next.js 教程系列(十)getStaticPaths 与动态路由的静态生成
前端·next.js
天天鸭26 分钟前
写个vite插件自动处理系统权限,降低99%重复工作
前端·javascript·vite
蓝婷儿30 分钟前
每天一个前端小知识 Day 23 - PWA 渐进式 Web 应用开发
前端
无奈何杨40 分钟前
CoolGuard风控中新增移动距离和移动速度指标
前端·后端
恋猫de小郭1 小时前
Google I/O Extended :2025 Flutter 的现状与未来
android·前端·flutter