JS原生陣列方法的用法及其實現（二）

entries()方法返回乙個新的array iterator物件，該物件包含陣列中每個索引的鍵/值對。

entries()函式返回的是乙個陣列的迭代物件，與generator 函式（可以參考阮一峰大叔寫的es6入門中的介紹generator 函式）的返回結果是一樣的，所以直接通過.next()依次得到結果，其中。如下

let arr =[1
,2,3
]let ent = arr.
entries()
console.
log(ent.
next()
)// 
// 其中，value是乙個陣列，為 [0, 1]，分別代表下標，以及下標對應的值
// done 是乙個boolean型別的值，代表遍歷是否以經結束
console.
log(ent.
next()
)// 
console.
log(ent.
next()
)// 
console.
log(ent.
next()
)// 
// 遍歷結束，done值變為true

實現方法的核心就是generator 函式。利用其的特性來完成陣列的迭代。

array.prototype.
myentries
=function*(
)}

find()方法返回陣列中滿足提供的測試函式的第乙個元素的值。否則返回 undefined。

find()類似於some()，不同的是，some()是判斷目標陣列中是否含有滿足條件的值，返回乙個boolean型別的值，而find()是找到目標陣列中滿足條件的第乙個值，並返回該值。使用方法如下：

let arr =[1
,2,3
]arr.
find
(ele => ele >2)
// 3
// => es6箭頭函式
arr.
find
(ele => ele >5)
// undefined
arr.
find
(ele => ele >5)
// uncaught typeerror: undefined is not a function
// find()中的引數函式依舊接收三個引數，分別為 value, index, arr

可見，find()依舊是通過遍歷來查詢符合條件的值，實現如下：

array.prototype.
myfind
=function
(fn, callback)}}
else
is not a funciton`
)// 丟擲乙個錯誤
}}

findindex()方法返回陣列中滿足提供的測試函式的第乙個元素的索引。否則返回-1。

findindex()與find()唯一的區別就是乙個返回元素本身，乙個返回索引。使用方法如下：

let arr =[1
,2,3
]arr.
findindex
(ele => ele >2)
// 2
arr.
findindex
(ele => ele >3)
// -1
arr.
findindex()
// uncaught typeerror: undefined is not a function
// findindex()中的引數函式依舊接收三個引數，分別為 value, index, arr

實現方法與find()的實現也是僅有一點差別，如下：

array.prototype.
myfindindex
=function
(fn, callback)}}
else
is not a funciton`
)// 丟擲乙個錯誤
}return-1
// 沒有查詢到符合條件的，返回-1，find()的實現中沒寫，預設返回 undefined
}

flat()方法會按照乙個可指定的深度遞迴遍歷陣列，並將所有元素與遍歷到的子陣列中的元素合併為乙個新陣列返回。

剛看到的時候一臉懵逼，啥時候居然有這麼厲害的方法了。。。

flat()照我的理解就是將乙個多維陣列轉換為低維陣列，以及去掉其中的空項，同時，此方法不會改變原陣列。使用如下：

// flat 接收乙個引數，預設引數值為 1
let arr1 =[1
,2,3
,[4,
5,6]
]let arr2 =[1
,2,[
3,[4
,5,[
6,7]
]]]let arr3 =[1
,,3,
4, undefined,
null
]// 稀疏陣列
arr1.
flat()
// [1, 2, 3, 4, 5, 6]
arr2.
flat()
// [1, 2, 3, [4, 5, [6, 7]]]
// 採用預設值 1，只提取了一層的多維陣列，讓維度從4變為3
arr2.
flat(3
)// [1, 2, 3, 4, 5, 6, 7]
arr3.
flat()
// [1, 3, 4, undefined, null]
// 只去掉了空項，而不管值是否為 undefined，或 null

實現的話，二維降一維很簡單，通過解構就可以實現，那麼多維降維，就需要多次解構，但是這個次數是不一定的，所以可以通過遞迴實現。實現如下：

array.prototype.
myflat
=function
(src =
1, callback)
else
}else
is not a number.`)}
oarr.
foreach
(ele => newarr.
push
(ele)
)// 通過foreach去掉空項，map也可以實現
return newarr
}

以上有個缺陷，就是對輸入的過大的引數沒有處理。

includes()方法用來判斷乙個陣列是否包含乙個指定的值，根據情況，如果包含則返回 true，否則返回false。

看到這個方法就想到了some()，二者有異曲同工之妙，some()是判斷指定陣列是否有元素符合條件，而includes()則將這個條件直接限制為了乙個具體的值。使用方法如下：

// includes 接收兩個引數，第乙個是要查詢的值 src，第二個是開始查詢的索引 index
// 如果第二個引數即索引為正，則從該索引處開始查詢
// 如果第二個引數即索引為負，則從 arr.length + index 處開始查詢
// 第二個引數的預設值為 0
let arr =[1
,2,3
,4]arr.
includes(2
)// true
arr.
includes(2
,1)// true
arr.
includes(2
,-1)
// false
arr.
includes()
// false

實現方法類似於some()的實現，不再贅述，直接開始：

array.prototype.
myincludes
=function
(src, index =0)
}return flag
}

indexof()方法返回在陣列中可以找到乙個給定元素的第乙個索引，如果不存在，則返回-1。

（未完待續）

JS陣列方法的原生實現

該方法接受任意個引數，然後新增到陣列的末尾 function push arr,arg push 接受任意個引數，按照順序新增到陣列末尾，返回新的陣列長度 return arr.length 該方法刪除並返回陣列的最後乙個元素，如果陣列為空，返回undefined function pop arr ...

原生JS常用陣列方法大全

一，陣列的方法以下方法是原有陣列發生改變 1 shift 刪除陣列第一項，括號裡邊沒有引數。例如 var ary 1,2,3,4 var res ary.shift console.log res 返回的值是被刪除的第一項 1 console.log ary 列印出的是被刪除後的新的陣列 2,3,...

js陣列原生方法的實現

1 陣列遍歷foreach 自定義foreach param fn 待執行方法 function foreach fn 2 陣列對映map 自定義map param fn 待執行方法 function map fn return list 3陣列過濾filter 自定義filter param fn...

JS原生陣列方法的用法及其實現（二）

JS陣列方法的原生實現

原生JS常用陣列方法大全

js陣列原生方法的實現

相關推薦