Skip to content

JS数组常用方法

JavaScript 中数组(Array)和字符串(String)的内置方法非常丰富,掌握常用的高效函数能大幅提升开发效率。以下是按 “高频使用”“实用场景” 分类的精选函数:

1. 遍历与转换

  • forEach((item, index, arr) => {})
    遍历数组,无返回值(适合单纯执行操作,如打印、修改原数组)。

    javascript
    [1,2,3].forEach((num, i) => console.log(num * 2)); // 2,4,6
  • map((item) => {})
    遍历并返回新数组(不修改原数组,适合数据转换)。

    javascript
    const doubled = [1,2,3].map(num => num * 2); // [2,4,6]
  • filter((item) => {})
    筛选符合条件的元素,返回新数组。

    javascript
    const evens = [1,2,3,4].filter(num => num % 2 === 0); // [2,4]
  • reduce((acc, item) => {}, initialValue)
    累加/聚合数组,返回单一结果(万能函数,可替代 sum、flatten 等)。

    javascript
    const sum = [1,2,3].reduce((acc, num) => acc + num, 0); // 6
    const flattened = [[1,2],[3,4]].reduce((acc, arr) => [...acc, ...arr], []); // [1,2,3,4]

2. 查找与判断

  • find((item) => {})
    返回第一个符合条件的元素(适合找唯一值)。

    javascript
    const user = [{id:1}, {id:2}].find(u => u.id === 2); // {id:2}
  • findIndex((item) => {})
    返回第一个符合条件的元素索引(找不到返回 -1)。

    javascript
    const index = [10,20,30].findIndex(num => num > 15); // 1
  • includes(item)
    判断数组是否包含某元素(返回布尔值,适合简单查找)。

    javascript
    [1,2,3].includes(2); // true
  • some((item) => {}) / every((item) => {})

    • some:是否至少有一个元素符合条件(“或”逻辑)。
    • every:是否所有元素都符合条件(“与”逻辑)。
    javascript
    [1,3,5].some(num => num % 2 === 0); // false(无偶数)
    [2,4,6].every(num => num % 2 === 0); // true(全是偶数)

3. 增删改查

  • push(item1, ...) / pop()

    • push:在末尾添加元素(返回新长度)。
    • pop:删除末尾元素(返回被删除元素)。
  • unshift(item1, ...) / shift()

    • unshift:在开头添加元素(返回新长度)。
    • shift:删除开头元素(返回被删除元素)。
  • slice(start, end)
    截取子数组(不修改原数组,end 不包含)。

    javascript
    [1,2,3,4].slice(1,3); // [2,3]
  • splice(start, deleteCount, ...addItems)
    增删改原数组(返回被删除元素,会修改原数组)。

    javascript
    const arr = [1,2,3];
    arr.splice(1, 1, 5); // 删除索引1的元素,插入5 → 原数组变为 [1,5,3]
  • concat(arr1, arr2, ...)
    合并数组(返回新数组,不修改原数组)。

    javascript
    [1,2].concat([3,4], [5]); // [1,2,3,4,5]

4. 排序与反转

  • sort((a,b) => {})
    排序数组(修改原数组,默认按字符串排序,需自定义比较函数)。

    javascript
    [3,1,2].sort((a,b) => a - b); // [1,2,3](升序)
  • reverse()
    反转数组(修改原数组)。

    javascript
    [1,2,3].reverse(); // [3,2,1]

总结

  • 数组核心场景:遍历转换(map/filter)、聚合计算(reduce)、查找判断(find/includes)、增删改(splice/slice)。