JavaScript数组方法有哪些_如何高效操作数据【教程】_技术教程

会改变原数组的5个方法是push、pop、unshift、shift、splice、reverse和sort；其中unshift/shift性能差，splice易误用，sort默认字符串排序需传比较函数。

JavaScript 数组方法本身没有“高效”或“低效”的绝对划分，关键在于选对方法、避开隐式转换和意外副作用。用错 map 做过滤、误用 splice 破坏原数组、在大数组上滥用 sort 默认比较，才是性能和逻辑出问题的根源。

哪些数组方法会改变原数组？必须警惕的 5 个突变操作

这些方法直接修改 Array.prototype 上的原始数组，若后续还依赖原数据，就会出 bug：

push / pop：末尾增删 —— 安全，但注意返回值是新长度/被删元素，不是数组本身
unshift / shift：开头增删 —— 性能差（需重排所有索引），大数组慎用
splice：任意位置增删改 —— 最易误用：第一个参数是起始索引，第二个是删除个数，第三个起才是插入项；不传第二个参数 ≠ 不删除（实际会删到末尾）
reverse 和 sort：看似只排序，实则原地修改；sort() 默认按字符串 Unicode 排序，数字数组必须传 (a, b) => a - b

const arr = [3, 1, 4];
arr.sort(); // ❌ 结果是 [1, 3, 4]？不对，是 [1, 3, 4] 看似对，但其实是字符串比：'1' < '3' < '4' → 恰好碰对；换成 [10, 2] 就崩：[10, 2].sort() → [10, 2]（因为 '10' < '2'）

filter/map/reduce 三件套：什么时候该用哪一个？

它们都不改原数组，但语义和适用场景截然不同：

filter：只做「筛选」，返回布尔值，输出数组长度 ≤ 输入数组
map：只做「一对一转换」，每个输入项产出一个输出项，输出数组长度 === 输入数组
reduce：做「聚合」，把数组逐步压缩成单个值（对象、数字、字符串、甚至新数组），适合求和、分组、扁平化、链式条件判断

const nums = [1, 2, 3, 4];
nums.filter(x => x > 2);     // [3, 4]
nums.map(x => x * 2);        // [2, 4, 6, 8]
nums.reduce((sum, x) => sum + x, 0); // 10
// 扁平化二维数组？别用 map 套 map，用 reduce：
[[1,2], [3,4]].re
duce((acc, row) => acc.concat(row), []); // [1,2,3,4]

find/findIndex/includes：查找类方法的兼容性与陷阱

它们都返回「存在性结果」，但行为差异明显，且部分不支持 IE：

includes：ES2016，判断值是否存在（支持 NaN，而 indexOf 不行），但无法获取位置
find：返回匹配的第一个元素（对象引用），适合找对象；注意它不严格等于 filter(...)[0]，因为后者多一次遍历且创建新数组
findIndex：返回索引，比 indexOf 强在支持函数判断（比如找 obj.status === 'active'）
IE 兼容方案：用 some 替代 includes，用 find 的 polyfill 或降级为 for 循环

const users = [{id: 1, name: 'Alice'}, {id: 2, name: 'Bob'}];
users.find(u => u.id === 2);      // {id: 2, name: 'Bob'}
users.findIndex(u => u.name === 'Alice'); // 0
[1, 2, NaN].includes(NaN);        // true ← 这是它比 indexOf 好的关键点

flat() 和 at()：新语法虽好，但上线前得看环境

flat 和 at 是近年高频新增方法，写起来简洁，但部署时容易踩兼容性坑：

flat：默认只拍一层，flat(Infinity) 才彻底扁平；IE 完全不支持，Chrome 69+、Firefox 62+ 支持；Node.js 11.0+ 开始支持
at：支持负索引（arr.at(-1) 取末尾），比 arr[arr.length - 1] 安全（不会因空数组报错）；但 Safari 15.4 之前、旧版 Node.js 都不支持
线上项目若需兼容，建议用 Babel 编译，或封装 fallback：arr.at?.(-1) ?? arr[arr.length - 1]

[1, [2, [3]]].flat();        // [1, 2, [3]]
[1, [2, [3]]].flat(2);       // [1, 2, 3]
['a', 'b'].at(-1);           // 'b'
[].at(-1);                   // undefined（安全）

真正影响效率的从来不是方法名长短，而是是否触发隐式类型转换、是否重复遍历、是否创建中间数组。写完一行数组操作，先问自己：它遍历了几次？改了原数组吗？返回的是我真正要的东西，还是还得再加工？