作者 | 哪吒

來源 | CSDN博客

最近小編在看文章的時候，總有很多剛剛入門的小白說精通這個，精通那個技術，更有意思的是，最近看到一則簡歷上說精通 JavaScript ，聊一聊發現數組還不明白，就對外說精通~所以今天小編就給大家說道說道，文末更是有福利，伙伴們可以積極領取呦~

如何判斷一個對象是不是數組？

在只有一個全局作用域的時候，使用instanceof操作符就足矣：

if(value instanceof Array){//操作數組 }

使用instanceof的前提是只有一個全局執行上下文，如果網頁里有多個框架，則可能涉及兩個不同的全局上下文，因此就會有兩個不同版本的Array構造函數。如果要把數組從一個框架傳到另一個框架，則這個數組的構造函數將有別于第二個框架內本地創建的數組。

為了解決這個問題，ECMAScript提供了 Array.isArray()方法。這個方法的目的就是確定一個值是否為數組，而不用管它是在哪個全局執行上下文中創建的。

if(Array.isArray(value)){//操作數組 }

填充方法fill()

1、ES6新增了兩個方法

批量復制方法copyWithin()，以及填充數組方法fill()。

這兩個方法的函數比較類似，都需要指定既有數組實例上的一個范圍，包含開始索引，不包含結束索引，使用這個方法不會改變數組的大小。

2、fill()

使用fill()方法可以向一個已有的數組中插入全部或部分相同的值。開始索引用于指定開始填充的位置，它是可選的。如果不提供結束索引，則一直填充到數組末尾。負值索引從數組末尾開始計算。

例如：

（1）用1填充整個數組

const?arr?=?[0,0,0,0,0]?

arr.fill(1);//[1,1,1,1,1]?

arr.fill(0);//[0,0,0,0,0]//重置為0

（2）用2填充索引大于等于2的元素

arr.fill(2,2);//[0,0,2,2,2]?

arr.fill(0);//[0,0,0,0,0]//重置為0

（3）使用3填充索引大于等于1且小于3的元素

arr.fill(2,1,3);//[0,3,3,0,0]

（4）用4填充索引大于等于1且小于4的元素

arr.fill(4,-4,-1);//[0,4,4,4,0]

注意：fill()會自動忽略超出數組邊界、零長度及方向相反的索引范圍。

復制方法copyWithin()

copyWithin()會按照指定范圍淺復制數組中的部分內容，然后將他們插入到指定索引開始的位置。

例如：

let arr,reset = () => arr = [0,1,2,3,4,5,6,7,8,9]; reset();

（1）從arr中復制索引5開始的內容，插入到索引0開始的位置

arr.copyWithin(0,5);//[5,6,7,8,9,5,6,7,8,9] reset();

//從arr中復制索引0開始到索引3結束的內容，插入到索引4開始的地方

arr.copyWithin(4,0,3);//[0,1,2,3,0,1,2,7,8,9]

棧方法

ECMAScript給數組提供了相當于棧操作的方法。

棧是一種后進先出（LIFO，Last-In-First-Out）的結構，也就是最近添加的元素先被刪除。

• 插入push();

• 刪除pop();

隊列方法

隊列以先進先出（FIFO，First-In-First-Out）形式的結構。

• 插入push();

• 取出shift();

排序方法

數組有兩個方法可以用來對元素進行重排序：

• reverse()

• sort()

操作方法

1、合并concat()

2、切割slice()

slice()用于創建一個包含原有數組中一個或多個元素的新數組。

搜索和位置方法

ECMAScript提供兩類搜索數組的方法，按嚴格相等搜索和按斷言函數搜索。

1、嚴格相當搜索

ECMAScript提供了3中嚴格相等的搜索方法：

indexOf()

lastIndexOf()

includes()

2、斷言函數

find()

findIndex()

迭代方法

1、every()和some()

every()對數組每一項都進行傳入的函數，如果對每一項函數都返回true，則這個方法返回true。

some()對數組每一項都運行傳入的函數，如果有一項返函數返回true，則就返回true。

例如：

let nums = [1,2,3,4,5,4,3,2,1]; let ret = nums.every((item,index,array) => item > 2);//false ret?=?nums.some((item,index,array)?=>?item?>?2);//true

2、filter()

filter()是基于給定的函數來決定某一項是否應該包含在它返回的數組中。

比如，要返回一個所有元素都大于2的數組：

let ret = nums.filter((item,index,array) => item>2);//[3,4,5,4,3]

3、map()

map()返回一個數組，這個數組的每一項都是原始數組中同樣位置的元素進行傳入函數而返回的結果。

例如，對數組中的所有元素都乘以2：

let ret = nums.map((item,index ,array) => item * 2);//[2,4,6,8,10,8,6,4,2]

4、foreach()

foreach()只會對每一項運行傳入的函數，沒有返回值。本質上foreach()就相當于for循環遍歷數組。

nums.foreach((item,index,array) => {//執行某些操作 });

歸并方法reduce()

reduce()對每一項都會運行的歸并函數。

reduce()函數有四個參數：

上一個歸并值

當前項

當前項的索引

數組本身

這個函數返回的任何值都會作為下一次調用同一函數的第一個參數。如果沒有傳入可選的第二個參數（作為歸并起始點），則第一次迭代將從數組的第二項開始，因此傳遞歸并函數的第一個參數是數組的第一項，第二個參數是數組的第二項。

可以使用reduce()對數組中所有值進行求和操作。

let nums = [1,2,3,4,5]; let ret = nums.reduce((prev,cur,index,array){return prev+cur; }); alert(ret);//15

在評論區留言你對本文的觀點

CSDN云計算將選出五名優質留言

攜手【中國青年出版社-中青雄獅圖書】送出

《JavaScript從入門到實戰開發最強教科書：完全版》

截至4月1日14:00點

往期推薦

如果讓你來設計網絡

寫時復制就這么幾行代碼，還是不會？

留不住客戶？該從你的系統上找找原因了！

明明還有大量內存，為啥報錯“無法分配內存”？

點分享

點收藏

點點贊

點在看

總結

以上是生活随笔為你收集整理的JavaScript 数组你都掰扯不明白，还敢说精通 JavaScript ？| 赠书的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。