JavaScript数组方法分为原地修改和返回新数组两类：push/pop/unshift/shift/splice/reverse/sort/fill会改变原数组；map/filter/slice/concat/flat/toSorted/toReversed/toSpliced则返回新数组且不改变原数组。

JavaScript中有些数组方法会直接修改原数组，有些则返回新数组而不影响原始数据。区分这两类方法对避免意外副作用很关键。

会改变原数组的方法

这些方法在调用后，原始数组的内容、长度或顺序会发生变化：

• push()：在末尾添加一个或多个元素，返回新长度
• pop()：删除最后一个元素，返回被删元素
• unshift()：在开头添加一个或多个元素，返回新长度
• shift()：删除第一个元素，返回被删元素
• splice()：从指定位置增删改元素，返回被删除的元素组成的数组
• reverse()：反转数组顺序，返回原数组引用
• sort()：按字符串 Unicode 码点排序（默认），可传比较函数，返回原数组引用
• fill()：用指定值填充数组的某一段，返回原数组引用

不会改变原数组的方法（返回新数组）

这些方法生成并返回一个新数组，原数组保持不变：

• map()：对每个元素执行函数，返回新数组
• filter()：筛选符合条件的元素，返回新数组
• slice()：提取子数组，返回新数组（不修改原数组）
• concat()：合并数组，返回新数组
• flat()：扁平化嵌套数组，返回新数组
• toSorted()、toReversed()、toSpliced()（ES2025+）：对应 sort/reverse/splice 的不可变版本

容易混淆的特殊情况

有些方法看似“安全”，但需注意细节：

• forEach() 不改变原数组结构，但如果回调里手动修改数组（如 arr[i] = xxx），仍会影响原数组
• find()、findIndex()、includes() 等只读方法完全不影响原数组
• Array.from() 和展开运算符 [...arr] 都创建浅拷贝，适合做不可变操作的基础

实用建议

日常开发中推荐：

• 优先使用不可变方法（如 map/filter/slice），配合 const 声明变量，减少隐式修改
• 若必须修改原数组（如性能敏感场景或与老代码兼容），明确用 push/splice 等，并加注释说明意图
• 需要深拷贝时，不要依赖 slice 或展开符（它们只浅拷贝），考虑 structuredClone() 或 JSON 序列化（注意限制）

# javascript  # java  # js  # json  # red 

相关栏目： 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571 】

相关推荐： 米侠浏览器网页背景异常怎么办 米侠显示修复  node.js报错：Cannot find module 'ejs'的解决办法  香港网站服务器数量如何影响SEO优化效果？  如何在建站主机中优化服务器配置？  Laravel Admin后台管理框架推荐_Laravel快速开发后台工具  阿里云高弹*务器配置方案｜支持分布式架构与多节点部署  如何用PHP快速搭建CMS系统？  详解Android图表 MPAndroidChart折线图  Laravel怎么发送邮件_Laravel Mail类SMTP配置教程  英语简历制作免费网站推荐,如何将简历翻译成英文？  Linux虚拟化技术教程_KVMQEMU虚拟机安装与调优  java ZXing生成二维码及条码实例分享  专业型网站制作公司有哪些,我设计专业的，谁给推荐几个设计师兼职类的网站？  Laravel Facade的原理是什么_深入理解Laravel门面及其工作机制  Laravel Eloquent性能优化技巧_Laravel N+1查询问题解决  香港服务器WordPress建站指南：SEO优化与高效部署策略  如何在 Python 中将列表项按字母顺序编号（a.、b.、c. …）  制作旅游网站html,怎样注册旅游网站？  魔毅自助建站系统：模板定制与SEO优化一键生成指南  详解阿里云nginx服务器多站点的配置  Win11搜索栏无法输入_解决Win11开始菜单搜索没反应问题【技巧】  jQuery 常见小例汇总  微信小程序 HTTPS报错整理常见问题及解决方案  ai格式如何转html_将AI设计稿转换为HTML页面流程【页面】  Windows10怎样连接蓝牙设备_Windows10蓝牙连接步骤【教程】  如何快速查询网站的真实建站时间？  详解ASP.NET 生成二维码实例（采用ThoughtWorks.QRCode和QrCode.Net两种方式）  JavaScript模板引擎Template.js使用详解  微信小程序 require机制详解及实例代码  HTML 中如何正确使用模板变量为元素的 name 属性赋值  javascript中的try catch异常捕获机制用法分析  Laravel如何创建自定义Facades？（详细步骤）  如何用wdcp快速搭建高效网站？  laravel怎么使用数据库工厂（Factory）生成带有关联模型的数据_laravel Factory生成关联数据方法  如何在宝塔面板中创建新站点？  成都网站制作公司哪家好,四川省职工服务网是做什么用？  如何快速搭建支持数据库操作的智能建站平台？  Android okhttputils现在进度显示实例代码  北京专业网站制作设计师招聘,北京白云观官方网站？  Laravel怎么做缓存_Laravel Cache系统提升应用速度的策略与技巧  Laravel PHP版本要求一览_Laravel各版本环境要求对照  大连 网站制作,大连天途有线官网？  Laravel如何为API生成Swagger或OpenAPI文档  香港服务器选型指南：免备案配置与高效建站方案解析  VIVO手机上del键无效OnKeyListener不响应的原因及解决方法  网站广告牌制作方法,街上的广告牌，横幅，用PS还是其他软件做的？  图册素材网站设计制作软件,图册的导出方式有几种？  Laravel怎么使用Collection集合方法_Laravel数组操作高级函数pluck与map【手册】  Laravel模型关联查询教程_Laravel Eloquent一对多关联写法  JS实现鼠标移上去显示图片或微信二维码