js中常用的数组操作
本文按「增删改 → 遍历 → 转换 → 排序反转 → 其他常用」五类，整理 JavaScript 数组的常用方法。表中统一标注：作用、返回值、是否改变原数组（原数组被修改记「是」，返回新数组记「否」）。
1. 数组增删改
1.1 添加元素
| 方法 | 作用 | 返回值 | 是否改变原数组 |
|---|---|---|---|
push() | 在数组末尾添加元素 | 新数组长度 | 是 |
unshift() | 在数组开头添加元素 | 新数组长度 | 是 |
concat() | 合并数组，返回新数组 | 新数组 | 否 |
splice() | 在指定位置插入/删除元素 | 被删除的元素数组 | 是 |
js
12345678910
const arr = [1, 2, 3];
arr.push(4); // 返回 4，arr 变为 [1, 2, 3, 4]
arr.unshift(0); // 返回 5，arr 变为 [0, 1, 2, 3, 4]
const merged = arr.concat([5, 6]);
// merged: [0, 1, 2, 3, 4, 5, 6]，arr 不变
// 从索引 1 开始删除 0 个元素，插入 9
arr.splice(1, 0, 9); // 返回 []，arr 变为 [0, 9, 1, 2, 3, 4]
1.2 删除元素
| 方法 | 作用 | 返回值 | 是否改变原数组 |
|---|---|---|---|
pop() | 删除最后一个元素 | 被删除的元素 | 是 |
shift() | 删除第一个元素 | 被删除的元素 | 是 |
splice() | 删除指定位置元素 | 被删除的元素数组 | 是 |
filter() | 过滤符合条件的元素 | 新数组 | 否 |
js
1234567
const arr = [1, 2, 3, 4, 5];
arr.pop(); // 返回 5，arr 变为 [1, 2, 3, 4]
arr.shift(); // 返回 1，arr 变为 [2, 3, 4]
const kept = arr.filter((x) => x > 2);
// kept: [3, 4]，arr 不变
1.3 修改元素
| 方法 | 作用 | 返回值 | 是否改变原数组 |
|---|---|---|---|
splice() | 替换指定位置元素 | 被删除的元素数组 | 是 |
| 直接索引赋值 | arr[i] = 值 | 修改后的值 | 是 |
js
12345
const arr = [1, 2, 3, 4, 5];
arr[0] = 99; // arr 变为 [99, 2, 3, 4, 5]
arr.splice(1, 2, 100); // 返回 [2, 3]，arr 变为 [99, 100, 4, 5]
2. 数组遍历
| 方法 | 作用 | 返回值 | 是否改变原数组 |
|---|---|---|---|
forEach() | 遍历数组 | undefined | 否 |
map() | 映射新数组 | 新数组 | 否 |
filter() | 过滤数组 | 新数组 | 否 |
find() | 查找第一个匹配项 | 元素或 undefined | 否 |
findIndex() | 查找第一个匹配项的索引 | 索引或 -1 | 否 |
some() | 检查是否至少有一个满足条件 | boolean | 否 |
every() | 检查是否所有元素满足条件 | boolean | 否 |
js
1234567891011121314
const arr = [1, 2, 3, 4, 5];
arr.forEach((x) => console.log(x)); // 依次打印 1 2 3 4 5
const doubled = arr.map((x) => x * 2);
// doubled: [2, 4, 6, 8, 10]
const evens = arr.filter((x) => x % 2 === 0);
// evens: [2, 4]
const firstEven = arr.find((x) => x % 2 === 0); // 2
const firstEvenIdx = arr.findIndex((x) => x % 2 === 0); // 1
const hasEven = arr.some((x) => x % 2 === 0); // true
const allEven = arr.every((x) => x % 2 === 0); // false
3. 数组转换
| 方法 | 作用 | 返回值 | 是否改变原数组 |
|---|---|---|---|
join() | 数组转字符串 | string | 否 |
toString() | 数组转字符串（逗号分隔） | string | 否 |
Array.from() | 类数组转数组 | 新数组 | 否 |
flat() | 数组扁平化 | 新数组 | 否 |
flatMap() | 先 map() 再 flat(1) | 新数组 | 否 |
js
123456789101112
const arr = [1, 2, 3];
arr.join("-"); // "1-2-3"
arr.toString(); // "1,2,3"
Array.from("abc"); // ["a", "b", "c"]
const nested = [1, [2, 3], 4];
nested.flat(); // [1, 2, 3, 4]
const mapped = arr.flatMap((x) => [x, x * 2]);
// [1, 2, 2, 4, 3, 6]
4. 数组排序 & 反转
| 方法 | 作用 | 返回值 | 是否改变原数组 |
|---|---|---|---|
sort() | 排序（默认按 Unicode） | 排序后的数组 | 是 |
reverse() | 反转数组 | 反转后的数组 | 是 |
js
1234567
const arr = [3, 1, 4, 2];
arr.sort(); // 默认按字符串比较
// arr: [1, 2, 3, 4]
arr.sort((a, b) => a - b); // 数字升序
arr.reverse(); // arr: [4, 3, 2, 1]
注意：
sort()默认把元素转成字符串按 Unicode 比较，所以[10, 2, 1].sort()的结果是[1, 10, 2]。数字排序务必传入比较函数。
5. 其他常用方法
| 方法 | 作用 | 返回值 | 是否改变原数组 |
|---|---|---|---|
slice() | 截取子数组 | 新数组 | 否 |
includes() | 检查是否包含某元素 | boolean | 否 |
indexOf() | 查找元素索引（严格相等） | 索引或 -1 | 否 |
reduce() | 从左向右累积计算 | 计算结果 | 否 |
reduceRight() | 从右向左累积计算 | 计算结果 | 否 |
js
12345678
const arr = [1, 2, 3, 4, 5];
arr.slice(1, 3); // [2, 3]，arr 不变
arr.includes(3); // true
arr.indexOf(3); // 2
const sum = arr.reduce((acc, cur) => acc + cur, 0); // 15
const sumFromRight = arr.reduceRight((acc, cur) => acc + cur, 0); // 15