一、數(shù)組方法分類(lèi)及應(yīng)用場(chǎng)景
- 遍歷與操作
| 方法 | 作用 | 應(yīng)用場(chǎng)景 | 示例 |
|---|---|---|---|
| forEach | 遍歷元素并執(zhí)行操作 | 日志記錄、元素轉(zhuǎn)換 | [1,2].forEach(x=>console.log(x)) |
| map | 生成新數(shù)組(元素轉(zhuǎn)換) | 數(shù)據(jù)格式化、計(jì)算衍生值 | [1,2].map(x=>x*2) // [2,4] |
| filter | 篩選符合條件的元素 | 數(shù)據(jù)過(guò)濾 | [1,2,3].filter(x=>x>1) // [2,3] |
| some | 檢查至少一個(gè)元素滿足條件 | 快速驗(yàn)證(如表單校驗(yàn)) | [1,2].some(x=>x>1) // true |
| every | 檢查所有元素滿足條件 | 數(shù)據(jù)有效性驗(yàn)證 | [2,4].every(x=>x%2===0) // true |
- 轉(zhuǎn)換與生成
| 方法 | 作用 | 應(yīng)用場(chǎng)景 | 示例 |
|---|---|---|---|
| reduce | 從左到右對(duì)數(shù)組元素執(zhí)行累加器函數(shù) | 求和、統(tǒng)計(jì)、復(fù)雜計(jì)算 | [1,2].reduce((a,b)=>a+b,0) // 3 |
| join | 合并為字符串 | 生成 CSV 或文本 | ['a','b'].join(',') // 'a,b' |
| concat | 合并多個(gè)數(shù)組 | 數(shù)組合并 | [1].concat([2,[3,4]]) // [1,2,[3,4]] |
| flat | 扁平化多維數(shù)組 | 處理嵌套數(shù)據(jù) | [[1,2],3].flat() // [1,2,3] |
| fill | 用固定值填充數(shù)組 | mask敏感數(shù)據(jù)(value, start, end) | [1,2,3,4].fill(0, 1, 3) // [1,0,0,4] |
- 查找與定位
| 方法 | 作用 | 應(yīng)用場(chǎng)景 | 示例 |
|---|---|---|---|
| find | 返回第一個(gè)符合條件的元素 | 精準(zhǔn)定位數(shù)據(jù) | [{id:1}].find(x=>x.id==1) // {id:1} |
| findIndex | 返回第一個(gè)符合條件的元素索引 | 定位數(shù)據(jù)位置 | ['a','b'].findIndex(x=>'b') // 1 |
| indexOf | 返回元素首次出現(xiàn)的索引 | 檢查元素存在性 | ['a','b'].indexOf('b') // 1 |
| includes | 返回布爾值 | 判斷數(shù)組是否包含某個(gè)值 | [1,2,3].includes(1) // true |
- 排序與修改
| 方法 | 作用 | 應(yīng)用場(chǎng)景 | 示例 |
|---|---|---|---|
| sort | 對(duì)數(shù)組排序 | 數(shù)據(jù)排序 | [3,1,2].sort() // [1,2,3] 不帶參數(shù)以字母順序排序,或者傳一個(gè)函數(shù)arr.sort((a, b) => a-b); |
| reverse | 反轉(zhuǎn)數(shù)組順序 | 倒序處理 | [1,2].reverse() // [2,1] |
| splice | 增刪改元素 | 動(dòng)態(tài)修改數(shù)組 | [1,2,3].splice(1,1,4) // [1,4,3] |
| slice | 截取子串 | 兩個(gè)參數(shù)分別指定開(kāi)始結(jié)束位置,不包括第二個(gè)參數(shù)所在位置 | [1,2,3,4].slice(0,3) // [1,2,3] |
- 靜態(tài)方法
| 方法 | 作用 | 應(yīng)用場(chǎng)景 | 示例 |
|---|---|---|---|
| Array.isArray() | 判斷是否為數(shù)組 | 類(lèi)型檢查 | Array.isArray([]) // true |
| Array.from() | 類(lèi)數(shù)組或可迭代對(duì)象轉(zhuǎn)數(shù)組 | 轉(zhuǎn)換字符串、NodeList等 | Array.from('abc') // ['a','b','c'] |
| Array.of() | 創(chuàng)建指定元素的數(shù)組 | 避免單參數(shù)歧義 | Array.of(1) // [1] |
二、是否改變?cè)瓟?shù)組
- 修改原數(shù)組的方法
- splice 添加或者刪除數(shù)組中的元素
- fill 用固定值填充數(shù)組
- reverse 反轉(zhuǎn)
- sort 排序
- push 在末尾添加一個(gè)元素
- pop 刪除最后一個(gè)元素
- shift 刪除數(shù)組第一個(gè)元素
- unshift 在數(shù)組開(kāi)頭添加元素
- 不修改原數(shù)組的方法
- concat
- join
- toString
- indexOf
- includes
三、實(shí)際案例
- 多維數(shù)組扁平化(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] - 統(tǒng)計(jì)對(duì)象數(shù)組屬性(reduce)
const users = [
{ name: 'Alice', age: 25 },
{ name: 'Bob', age: 30 }
];
const ageSum = users.reduce((sum, user) => sum + user.age, 0); // 55 - 數(shù)組去重(filter + indexOf)
const arr = [1,2,2,3];
const unique = arr.filter((item, index) => arr.indexOf(item) === index); // [1,2,3]
四、注意事項(xiàng)
reduce 的初始值:未提供時(shí),初始值為第一個(gè)元素,索引從 1 開(kāi)始,空數(shù)組會(huì)報(bào)錯(cuò) 。
性能影響:splice、sort 等修改原數(shù)組的方法在大數(shù)據(jù)量時(shí)可能性能較低。
函數(shù)式編程:優(yōu)先使用 map/filter 等不修改原數(shù)組的方法,提升代碼可維護(hù)性 。
通過(guò)合理選擇方法,可顯著提升代碼效率和可讀性。