Array数组常见方法

3 阅读3分钟

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 中常用扩展运算符 ... 替代 concatslice

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)mapflat(1),常用于生成扁平列表
from(iterable)从类数组或可迭代对象创建数组(静态方法)
of(...items)创建包含指定元素的数组(静态方法)Array.of(3) → [3](区别于 new Array(3)

七、快速判断:是否改变原数组?

会改变原数组的方法(7个)
push, pop, shift, unshift, splice, sort, reverse

其余方法均不改变原数组,而是返回新数组或值。


典型应用场景示例

// 1. 数据过滤 + 转换
users.filter((u) => u.active).map((u) => u.name);

// 2. 求和
numbers.reduce((sum, n) => sum + n, 0);

// 3. 检查是否全为正数
numbers.every((n) => n > 0);

// 4. 找到第一个偶数
numbers.find((n) => n % 2 === 0);

// 5. 数组去重(结合 Set)
[...new Set(arr)];

// 6. 扁平化二维数组
arr.flat();