LOGO OA教程 ERP教程 模切知識交流 PMS教程 CRM教程 開發文檔 其他文檔  
 
網站管理員

25個每個開發人員都應該掌握的JavaScript 數組方法

admin
2025年7月1日 9:37 本文熱度 613

在前端開發中,數組無疑是最常用的數據結構之一。掌握好 JavaScript 提供的各種數組方法,能夠極大地提升我們處理數據的效率與代碼的可讀性。

無論是增刪改查、排序過濾,還是轉換映射,數組方法幾乎覆蓋了所有場景。

本文將系統梳理 25 個常用的 JavaScript 數組方法,配以簡潔示例,幫助你快速上手并靈活運用。

一、基本操作類

1. push()
向數組末尾添加一個或多個元素

let arr = [12];arr.push(3); // [1, 2, 3]

2. pop()
刪除數組末尾的元素并返回它

let arr = [123];arr.pop(); // 3, arr: [1, 2]

3. shift()

刪除數組開頭的元素并返回它。

let arr = [123];arr.shift(); // 1, arr: [2, 3]

4. unshift()

向數組開頭添加一個或多個元素。

let arr = [23];arr.unshift(1); // [1, 2, 3]

5.splice()

增刪改數組元素。

let arr = [1, 2, 3, 4];arr.splice(1, 2, 'a''b'); // [1, "a""b", 4]

二、遍歷與映射類

6. forEach() 

對數組的每個元素執行函數(無返回值)

[123].forEach(x => console.log(x));

7. map()

對每個元素執行函數并返回新數組

let doubled = [123].map(x => x * 2); // [2, 4, 6]

8. filter()

篩選符合條件的元素

let evens = [1234].filter(x => x % 2 === 0); // [2, 4]

9. reduce()

累計器,歸并成單一值。

let sum = [1234].reduce((acc, cur) => acc + cur, 0); // 10

10. reduceRight()

從右往左執行 reduce

let reversed = ['a''b''c'].reduceRight((acc, cur) => acc + cur); // 'cba'

三、查找與判斷類

11.find()

返回符合條件的第一個元素

let found = [1234].find(x => x > 2); // 3

12. findIndex()

返回符合條件的第一個元素索引。

let index = [1234].findIndex(x => x > 2); // 2

13. includes()

判斷數組是否包含某個值。

[1, 2, 3].includes(2); // true

14. indexOf()

返回某個值第一次出現的位置

[1, 2, 3, 2].indexOf(2); // 1

15. lastIndexOf()

返回某個值最后一次出現的位置

[1, 2, 3, 2].lastIndexOf(2); // 3

四、轉換類

16. join()

將數組轉換為字符串

[1, 2, 3].join('-'); // '1-2-3'

17. toString()

返回數組的字符串表示

[1, 2, 3].toString(); // '1,2,3'

18. flat()

扁平化嵌套數組

[1, [2, [3]]].flat(2); // [1, 2, 3]

19. flatMap()

先映射再扁平一層

[123].flatMap(x => [x, x * 2]); // [1, 2, 2, 4, 3, 6]

五、排序與反轉類

20. sort()

對數組進行排序(默認按字符串排序)

[3, 1, 2].sort(); // [1, 2, 3]

21. reverse()

反轉數組順序

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

六、數組構造與判斷類

22. Array.isArray() 

判斷是否為數組

Array.isArray([123]); // true

23. Array.from() 

將類數組對象轉為數組

Array.from('hello'); // ['h''e''l''l''o']

24. Array.of()

操作前,請先驗證。此方法可防止代碼本身出問題。

Array.of(123); // [1, 2, 3]

25. concat()

合并兩個或多個數組

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

寫在最后

以上就是我今天想與你分享的 25 個 JavaScript 中高頻使用的數組方法。熟悉它們不僅能讓你寫出更高效、更優雅的代碼,也能在面試和實際項目中更游刃有余。


該文章在 2025/7/1 9:37:22 編輯過
關鍵字查詢
相關文章
正在查詢...
點晴ERP是一款針對中小制造業的專業生產管理軟件系統,系統成熟度和易用性得到了國內大量中小企業的青睞。
點晴PMS碼頭管理系統主要針對港口碼頭集裝箱與散貨日常運作、調度、堆場、車隊、財務費用、相關報表等業務管理,結合碼頭的業務特點,圍繞調度、堆場作業而開發的。集技術的先進性、管理的有效性于一體,是物流碼頭及其他港口類企業的高效ERP管理信息系統。
點晴WMS倉儲管理系統提供了貨物產品管理,銷售管理,采購管理,倉儲管理,倉庫管理,保質期管理,貨位管理,庫位管理,生產管理,WMS管理系統,標簽打印,條形碼,二維碼管理,批號管理軟件。
點晴免費OA是一款軟件和通用服務都免費,不限功能、不限時間、不限用戶的免費OA協同辦公管理系統。
Copyright 2010-2025 ClickSun All Rights Reserved

黄频国产免费高清视频,久久不卡精品中文字幕一区,激情五月天AV电影在线观看,欧美国产韩国日本一区二区
亚洲国产另类一区在线5 | 亚洲人成在线天堂 | 亚洲欧美在线不卡 | 色婷婷六月亚洲婷婷 | 性色精品高清在线观看 | 在线精品亚洲一区二区小说 |