面试题:JavaScript 的数组有哪些原生方法?

JavaScript 的数组提供了丰富的原生方法,可以分为几大类:增删改查、遍历、转换、搜索、排序等。以下是常用方法的分类总结:


一、添加/删除元素(改变原数组)

这些方法会直接修改(mutate)原数组。

方法作用示例
push(...items)在数组末尾添加一个或多个元素,返回新长度arr.push(4, 5); // [1,2,3,4,5]
pop()移除并返回数组最后一个元素arr.pop(); // 返回 3, arr=[1,2]
unshift(...items)在数组开头添加一个或多个元素,返回新长度arr.unshift(0); // [0,1,2,3]
shift()移除并返回数组第一个元素arr.shift(); // 返回 1, arr=[2,3]
splice(start, deleteCount, ...items)start 位置开始,删除 deleteCount 个元素,并插入新元素arr.splice(1,1,'x'); // [1,'x',3]

二、遍历与迭代(不改变原数组)

这些方法用于遍历数组元素,通常不修改原数组(除非回调函数内部修改)。

方法作用是否返回新值
forEach(callback)对每个元素执行 callback 函数❌ (返回 undefined)
map(callback)对每个元素执行 callback,返回由结果组成的新数组
filter(callback)返回 callback 返回 true 的元素组成的新数组
some(callback)如果至少一个元素使 callback 返回 true,则返回 true
every(callback)如果所有元素都使 callback 返回 true,则返回 true
find(callback)返回第一个使 callback 返回 true 的元素
findIndex(callback)返回第一个使 callback 返回 true 的元素的索引
reduce(callback, initialValue)将数组“归约”为一个值
reduceRight(callback, initialValue)从右到左归约

示例

const nums = [1, 2, 3, 4];
nums.forEach(n => console.log(n)); // 遍历打印
const doubled = nums.map(n => n * 2); // [2,4,6,8]
const evens = nums.filter(n => n % 2 === 0); // [2,4]
const hasBig = nums.some(n => n > 3); // true
const sum = nums.reduce((acc, n) => acc + n, 0); // 10

三、转换与连接

方法作用返回值
join(separator)将所有元素用 separator 连接成字符串字符串
concat(...arrays)合并数组,返回新数组新数组
slice(start, end)返回从 startend(不包含)的浅拷贝新数组
toString()将数组转换为字符串(逗号分隔)字符串
flat(depth)将嵌套数组“拉平”新数组
flatMap(callback)mapflat(1)新数组

示例

const arr = [1, 2, 3];
arr.join('-'); // "1-2-3"
arr.concat([4,5]); // [1,2,3,4,5] (原数组不变)
arr.slice(1,3); // [2,3]
[1, [2, [3]]].flat(2); // [1,2,3]
[1,2,3].flatMap(x => [x, x*2]); // [1,2,2,4,3,6]

四、搜索与包含

方法作用返回值
indexOf(searchElement, fromIndex)返回 searchElement 第一次出现的索引,未找到返回 -1数字
lastIndexOf(searchElement, fromIndex)返回 searchElement 最后一次出现的索引数字
includes(searchElement, fromIndex)如果数组包含 searchElement,返回 true布尔值

示例

const fruits = ['apple', 'banana', 'orange'];
fruits.indexOf('banana'); // 1
fruits.includes('apple'); // true

五、排序与反转(改变原数组)

方法作用
sort(compareFunction)对数组元素进行排序(默认按字符串 Unicode 排序)
reverse()反转数组中元素的顺序

注意sort() 的默认行为可能不符合数值排序预期。

[10, 2, 1].sort(); // [1, 10, 2] (字符串排序)
[10, 2, 1].sort((a, b) => a - b); // [1, 2, 10] (数值升序)

六、其他有用方法

方法作用
Array.isArray(value)检查 value 是否为数组(静态方法)
Array.from(arrayLike, mapFn)从类数组或可迭代对象创建新数组
Array.of(...elements)创建具有可变数量参数的新数组(静态方法)

示例

Array.isArray([1,2,3]); // true
Array.from('hello'); // ['h','e','l','l','o']
Array.of(1); // [1] (对比 new Array(1) 是 [empty])

重要提示

  1. 可变性push, pop, shift, unshift, splice, sort, reverse 会改变原数组。其他方法如 map, filter, slice, concat 返回新数组,不修改原数组。
  2. 现代替代:优先使用 ... (扩展运算符) 和 Array.from() 来创建新数组,避免直接修改原数组(函数式编程思想)。
// 更好的方式(不修改原数组)
   const newArr = [...oldArr, newItem];
   const filtered = oldArr.filter(item => item > 0);

掌握这些原生方法是高效操作 JavaScript 数组的基础。

THE END
喜欢就支持一下吧
点赞8 分享