JavaScript陣列你都掰扯不明白,簡歷上你敢寫精通JavaScript?

mima2018發表於2022-03-10

一、如何判斷一個物件是不是陣列?

在只有一個全域性作用域的時候,使用instanceof運算子就足矣:


if(value instanceof Array){

//運算元組

}

1

2

3

使用instanceof的前提是隻有一個全域性執行上下文,如果網頁裡有多個框架,則可能涉及兩個不同的全域性上下文,因此就會有兩個不同版本的Array建構函式。如果要把陣列從一個框架傳到另一個框架,則這個陣列的建構函式將有別於第二個框架內本地建立的陣列。

為了解決這個問題,ECMAScript提供了 Array.isArray()方法。這個方法的目的就是確定一個值是否為陣列,而不用管它是在哪個全域性執行上下文中建立的。


if(Array.isArray(value)){

//運算元組

}

1

2

3

二、填充方法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

2

3

(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

1

2

3

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) => {

//執行某些操作


來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/70014946/viewspace-2868911/,如需轉載,請註明出處,否則將追究法律責任。

相關文章