JavaScript 的 Array 对象提供了非常丰富的方法,用于操作、遍历、转换和查询数组。以下是 常用 Array 方法的分类整理,包括作用、是否改变原数组、典型用途等:
一、增删改元素(会改变原数组)
| 方法 | 说明 | 返回值 | 是否改变原数组 |
|---|
push(...items) | 向末尾添加一个或多个元素 | 新长度 | ✅ |
pop() | 删除并返回最后一个元素 | 被删除的元素 | ✅ |
unshift(...items) | 向开头添加一个或多个元素 | 新长度 | ✅ |
shift() | 删除并返回第一个元素 | 被删除的元素 | ✅ |
splice(start, deleteCount, ...items) | 从指定位置删除/插入/替换元素 | 被删除的元素组成的数组 | ✅ |
splice 是最灵活的修改方法,可用于删除、插入、替换。
二、遍历与转换(不改变原数组)
| 方法 | 说明 | 返回值 |
|---|
forEach(callback) | 遍历每个元素,执行副作用 | undefined |
map(callback) | 将每个元素映射为新值 | 新数组 |
filter(callback) | 筛选满足条件的元素 | 新数组 |
reduce(callback, initialValue) | 累积计算(如求和、扁平化) | 累积结果 |
reduceRight(...) | 从右到左的 reduce | 累积结果 |
every(callback) | 所有元素都满足条件? | boolean |
some(callback) | 是否有至少一个元素满足? | boolean |
find(callback) | 返回第一个满足条件的元素 | 元素值(或 undefined) |
findIndex(callback) | 返回第一个满足条件的元素的索引 | 索引(或 -1) |
三、查找与判断
| 方法 | 说明 | 返回值 |
|---|
indexOf(value) | 查找元素首次出现的索引 | 索引(未找到为 -1) |
lastIndexOf(value) | 从后往前查找 | 索引 |
includes(value) | 是否包含某元素(ES2016) | boolean |
Array.isArray(obj) | 判断是否为数组(静态方法) | boolean |
四、数组组合与切片(不改变原数组)
| 方法 | 说明 | 返回值 |
|---|
concat(...arrays) | 合并多个数组 | 新数组 |
slice(start, end) | 提取子数组(左闭右开) | 新数组 |
join(separator) | 将数组转为字符串 | 字符串 |
toString() | 转为逗号分隔的字符串 | 字符串 |
✅ ES6 中常用扩展运算符 ... 替代 concat 和 slice:
const arr2 = [...arr1];
const merged = [...arr1, ...arr2];
五、排序与反转(会改变原数组)
| 方法 | 说明 |
|---|
reverse() | 反转数组顺序 |
sort(compareFn) | 排序(默认按字符串 Unicode 排)⚠️ 注意:会改变原数组!自定义排序需传比较函数,如 (a, b) => a - b |
六、其他实用方法
| 方法 | 说明 |
|---|
flat(depth) | 扁平化嵌套数组(ES2019)[1, [2, [3]]].flat(2) → [1,2,3] |
flatMap(callback) | 先 map 再 flat(1),常用于生成扁平列表 |
from(iterable) | 从类数组或可迭代对象创建数组(静态方法) |
of(...items) | 创建包含指定元素的数组(静态方法)Array.of(3) → [3](区别于 new Array(3)) |
七、快速判断:是否改变原数组?
✅ 会改变原数组的方法(7个):
push, pop, shift, unshift, splice, sort, reverse
❌ 其余方法均不改变原数组,而是返回新数组或值。
典型应用场景示例
users.filter((u) => u.active).map((u) => u.name);
numbers.reduce((sum, n) => sum + n, 0);
numbers.every((n) => n > 0);
numbers.find((n) => n % 2 === 0);
[...new Set(arr)];
arr.flat();