JavaScript 数组方法指南（快速查阅版）
概述
JavaScript 数组是开发中最常用的数据结构之一。本文将为你提供一份精炼的数组方法速查指南，包含最常用一些核心方法，方便快速查阅和使用。
本篇主要方便进行快速查阅，方法不进行过多讲解，如想看更详细的指南看我的下一篇文章——JavaScript 数组方法全指南（详细版）
一、修改原数组的方法（会改变原数组）
| 方法 | 作用 | 示例 | 返回值 |
|---|---|---|---|
| | 在数组末尾添加一个或多个元素 |
| 新数组长度 |
| | 删除数组最后一个元素 |
| 被删除的元素 |
| | 在数组开头添加一个或多个元素 |
| 新数组长度 |
| | 删除数组第一个元素 |
| 被删除的元素 |
| | 删除/替换/插入元素（万能方法） |
| 被删除的元素数组 |
| | 对数组排序（默认按 Unicode 排序） |
| 排序后的数组 |
| | 反转数组顺序 |
| 反转后的数组 |
| | 填充数组为固定值 |
| 修改后的数组 |
二、不修改原数组的方法（返回新数组或值）
| 方法 | 作用 | 示例 | 返回值 |
|---|---|---|---|
| | 合并多个数组 |
| 新数组 |
| | 截取数组片段 |
| 新数组 |
| | 将数组转为字符串（指定分隔符） |
| 字符串 |
| | 查找元素首次出现的索引（严格相等） |
| 索引/-1 |
| | 查找元素最后一次出现的索引 |
| 索引/-1 |
| | 判断数组是否包含某元素（ES6） |
| Boolean |
| | 查找第一个符合条件的元素（ES6） |
| 元素/undefined |
| | 查找第一个符合条件的元素索引（ES6） |
| 索引/-1 |
| | 扁平化嵌套数组（ES2019） |
| 新数组 |
| | 先映射再扁平化（ES2019） |
| 新数组 |
三、遍历数组的方法
| 方法 | 作用 | 示例 | 返回值 |
|---|---|---|---|
| | 遍历数组（无返回值） |
| undefined |
| | 映射新数组（返回处理后的值） |
| 新数组 |
| | 过滤符合条件的元素 |
| 新数组 |
| | 累积计算（从左到右） |
| 累积值 |
| | 累积计算（从右到左） |
| 累积值 |
| | 判断是否有元素符合条件（任一） |
| Boolean |
| | 判断是否所有元素符合条件（全部） |
| Boolean |
| | 返回数组索引的迭代器（ES6） |
| 迭代器 |
| | 返回数组元素的迭代器（ES6） |
| 迭代器 |
| | 返回索引-值对的迭代器（ES6） |
| 迭代器 |
四、ES6+ 新增实用方法
| 方法 | 作用 | 示例 |
|---|---|---|
| | 将类数组/可迭代对象转为数组 |
|
| | 创建包含任意数量元素的新数组 |
|
| | 复制数组内元素到指定位置（ES6） |
|
| | 支持负索引访问元素（ES2022） |
|
五、注意事项
-
修改原数组的方法：
push,pop,unshift,shift,splice,sort,reverse,fill（使用前需考虑是否需要备份原数组）。
-
性能优化：
-
大数据量时，
for循环比forEach/map更快。 -
reduce适合复杂累积计算，但可读性较差。
-
-
链式调用：
非破坏性方法（如
map,filter）可链式调用：arr.map(x => x*2).filter(x => x > 3); // [4,6] -
稀疏数组：
方法如
map,filter会跳过空位（empty），而forEach不会。
六、经典使用场景
// 1. 去重
const uniqueArr = [...new Set(arr)];
// 2. 求和
const sum = arr.reduce((a, b) => a + b, 0);
// 3. 对象数组按属性分组
const groupBy = (arr, key) =>
arr.reduce((acc, obj) => {
const group = obj[key];
acc[group] = acc[group] || [];
acc[group].push(obj);
return acc;
}, {});
// 4. 二维数组转对象
const pairs = [['a',1], ['b',2]];
const obj = Object.fromEntries(pairs); // {a:1, b:2}总结
-
增删元素：
push/pop/shift/unshift/splice -
查找/判断：
indexOf/includes/find/findIndex/some/every -
遍历/转换：
forEach/map/filter/reduce -
ES6+ 利器：
flat/flatMap/Array.from/at
Agent 垂直技术社区，欢迎活跃、内容共建。
更多推荐
36
0- 0
已为社区贡献4条内容
所有评论(0)