news 2026/6/15 21:12:48

JavaScript数组方法大全(按场景分类总结)

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
JavaScript数组方法大全(按场景分类总结)

JavaScript 数组中较为常用、好用的方法按使用场景分类总结如下,每个方法标注核心特点和适用场景,方便快速查阅和使用。

一、动态增删改(数组核心动态特性)

方法核心作用关键特点示例
push()尾部添加1+元素直接修改原数组,返回新长度arr.push(10, 20)→ [原元素,10,20]
pop()尾部删除1个元素直接修改原数组,返回被删元素arr.pop()→ 删除最后一个
unshift()头部添加1+元素直接修改原数组,返回新长度(性能略差)arr.unshift(5)→ [5, 原元素]
shift()头部删除1个元素直接修改原数组,返回被删元素arr.shift()→ 删除第一个
splice()任意位置增/删/改万能动态操作,直接修改原数组arr.splice(1,0,20)→ 索引1插入20;arr.splice(1,1)→ 索引1删除1个

二、查找/判断(快速找元素、验存在)

方法核心作用关键特点适用场景
includes()判断是否包含某元素返回布尔值,能识别NaN,语义最强基础类型(数字/字符串)判存在
indexOf()找元素首次出现的索引返回索引/-1,兼容旧环境,无法识别NaN兼容IE、需要获取元素位置
find()找第一个满足条件的元素返回元素/undefined,支持自定义条件复杂元素(对象)查找
findIndex()找第一个满足条件的索引返回索引/-1,支持自定义条件找复杂元素的位置

三、遍历处理(逐个操作元素)

方法核心作用关键特点适用场景
forEach()遍历数组执行回调无返回值,仅遍历(不能中断)简单遍历、无返回值的操作
map()遍历并返回新数组不修改原数组,返回“处理后的新数组”数组元素转换(如数值翻倍)
filter()筛选满足条件的元素不修改原数组,返回“符合条件的新数组”数组过滤(如筛选大于10的数)
some()判断是否有元素满足条件找到即停止遍历,返回布尔值判“是否存在”复杂条件元素
every()判断是否所有元素满足条件有一个不满足即停止,返回布尔值判“全部符合”(如全是正数)

四、转换/重组(生成新值/新数组)

方法核心作用关键特点示例
reduce()数组归并为单个值万能转换,支持累加/拼接/统计等arr.reduce((sum, n) => sum+n, 0)→ 求和
join()数组转字符串自定义分隔符,默认逗号[1,2].join("-")→ “1-2”
concat()数组合并不修改原数组,返回新数组[1].concat([2,3])→ [1,2,3]
slice()截取数组片段不修改原数组,返回新数组(左闭右开)[1,2,3].slice(0,2)→ [1,2]

五、排序/反转(调整元素顺序)

方法核心作用关键特点注意点
sort()数组排序直接修改原数组,默认按字符串排序数字排序需传回调:arr.sort((a,b)=>a-b)(升序)
reverse()数组反转直接修改原数组,返回反转后的原数组[1,2,3].reverse()→ [3,2,1]

六、其他高频实用方法

方法核心作用关键特点
flat()数组扁平化处理嵌套数组,flat(Infinity)拍平所有层级
fill()填充数组用指定值填充全部/部分元素,修改原数组
toString()数组转字符串等同于join(","),简单快捷

核心总结

  1. 动态操作:日常增删用push/pop(尾部)、unshift/shift(头部),任意位置操作选splice()

  2. 判断存在:基础类型用includes()(最便捷),复杂对象用some()

  3. 遍历处理:无返回值遍历用forEach(),生成新数组用map(),筛选元素用filter()

  4. 排序:数字排序一定要传回调(a,b)=>a-b(升序)/(a,b)=>b-a(降序),避免默认字符串排序坑;

  5. 核心原则map/filter/concat/slice不修改原数组,push/pop/splice/sort直接修改原数组,使用时注意区分。

这些方法覆盖了数组 95% 的日常使用场景,记住分类和核心特点,就能快速选对方法,不用重复写循环逻辑。

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/6/15 18:29:40

从标题到综述:paperzz 如何让硕士文献综述 “3 步出框架”

Paperzz-AI官网免费论文查重复率AIGC检测/开题报告/文献综述/论文初稿 paperzz - 文献综述https://www.paperzz.cc/journalsReviewed 文献综述是学术论文的 “地基”—— 既要梳理研究脉络、指出现有不足,还要锚定本研究的创新点,但很多硕士研究生会卡…

作者头像 李华
网站建设 2026/6/15 12:43:15

2026 AI 发展预测:从“爆发”走向“交付”,十大趋势全解读

第一篇先从 2026 年 AI 发展预测写起吧。说明一下:本文内容主要来自 Gemini 的 Deep Research对 2025 年底—2026 年初 多家机构( Gartner、Forrester、Stanford HAI、Deloitte等)的公开报告 / 新闻稿 / 研究文章做抓取与交叉比对总结,再由我做结构化整理…

作者头像 李华
网站建设 2026/6/15 12:43:56

DDIA(第二版)第4章:存储与检索

一、章节核心定位 本章聚焦数据库底层的存储与检索机制,解答“数据如何被存储”与“查询时如何被找到”两大核心问题,帮助开发者理解不同存储引擎的设计逻辑,从而为应用选择适配的存储方案。章节围绕事务型(OLTP) 与分…

作者头像 李华