一、数组方法分类及应用场景
- 遍历与操作
| 方法 | 作用 | 应用场景 | 示例 |
|---|---|---|---|
| forEach | 遍历元素并执行操作 | 日志记录、元素转换 | [1,2].forEach(x=>console.log(x)) |
| map | 生成新数组（元素转换） | 数据格式化、计算衍生值 | [1,2].map(x=>x*2) // [2,4] |
| filter | 筛选符合条件的元素 | 数据过滤 | [1,2,3].filter(x=>x>1) // [2,3] |
| some | 检查至少一个元素满足条件 | 快速验证（如表单校验） | [1,2].some(x=>x>1) // true |
| every | 检查所有元素满足条件 | 数据有效性验证 | [2,4].every(x=>x%2===0) // true |
- 转换与生成
| 方法 | 作用 | 应用场景 | 示例 |
|---|---|---|---|
| reduce | 从左到右对数组元素执行累加器函数 | 求和、统计、复杂计算 | [1,2].reduce((a,b)=>a+b,0) // 3 |
| join | 合并为字符串 | 生成 CSV 或文本 | ['a','b'].join(',') // 'a,b' |
| concat | 合并多个数组 | 数组合并 | [1].concat([2,[3,4]]) // [1,2,[3,4]] |
| flat | 扁平化多维数组 | 处理嵌套数据 | [[1,2],3].flat() // [1,2,3] |
| fill | 用固定值填充数组 | mask敏感数据(value, start, end) | [1,2,3,4].fill(0, 1, 3) // [1,0,0,4] |
- 查找与定位
| 方法 | 作用 | 应用场景 | 示例 |
|---|---|---|---|
| find | 返回第一个符合条件的元素 | 精准定位数据 | [{id:1}].find(x=>x.id==1) // {id:1} |
| findIndex | 返回第一个符合条件的元素索引 | 定位数据位置 | ['a','b'].findIndex(x=>'b') // 1 |
| indexOf | 返回元素首次出现的索引 | 检查元素存在性 | ['a','b'].indexOf('b') // 1 |
| includes | 返回布尔值 | 判断数组是否包含某个值 | [1,2,3].includes(1) // true |
- 排序与修改
| 方法 | 作用 | 应用场景 | 示例 |
|---|---|---|---|
| sort | 对数组排序 | 数据排序 | [3,1,2].sort() // [1,2,3] 不带参数以字母顺序排序，或者传一个函数arr.sort((a, b) => a-b); |
| reverse | 反转数组顺序 | 倒序处理 | [1,2].reverse() // [2,1] |
| splice | 增删改元素 | 动态修改数组 | [1,2,3].splice(1,1,4) // [1,4,3] |
| slice | 截取子串 | 两个参数分别指定开始结束位置,不包括第二个参数所在位置 | [1,2,3,4].slice(0,3) // [1,2,3] |
- 静态方法
| 方法 | 作用 | 应用场景 | 示例 |
|---|---|---|---|
| Array.isArray() | 判断是否为数组 | 类型检查 | Array.isArray([]) // true |
| Array.from() | 类数组或可迭代对象转数组 | 转换字符串、NodeList等 | Array.from('abc') // ['a','b','c'] |
| Array.of() | 创建指定元素的数组 | 避免单参数歧义 | Array.of(1) // [1] |
二、是否改变原数组
- 修改原数组的方法
- splice 添加或者删除数组中的元素
- fill 用固定值填充数组
- reverse 反转
- sort 排序
- push 在末尾添加一个元素
- pop 删除最后一个元素
- shift 删除数组第一个元素
- unshift 在数组开头添加元素
- 不修改原数组的方法
- concat
- join
- toString
- indexOf
- includes
三、实际案例
- 多维数组扁平化（reduce）
const nested = [[1,2],[3,[4]]];
const flat = nested.reduce((acc, val) =>
acc.concat(Array.isArray(val) ? val.flat() : val), []);
// [1,2,3,4] - 统计对象数组属性（reduce）
const users = [
{ name: 'Alice', age: 25 },
{ name: 'Bob', age: 30 }
];
const ageSum = users.reduce((sum, user) => sum + user.age, 0); // 55 - 数组去重（filter + indexOf）
const arr = [1,2,2,3];
const unique = arr.filter((item, index) => arr.indexOf(item) === index); // [1,2,3]
四、注意事项
reduce 的初始值：未提供时，初始值为第一个元素，索引从 1 开始，空数组会报错 。
性能影响：splice、sort 等修改原数组的方法在大数据量时可能性能较低。
函数式编程：优先使用 map/filter 等不修改原数组的方法，提升代码可维护性 。
通过合理选择方法，可显著提升代码效率和可读性。
