Js數(shù)組處理方式整理

SKYZACK 發(fā)布于2019-08-20 16:10 / 1696人閱讀

摘要：它的參數(shù)是一個(gè)回調(diào)函數(shù)，數(shù)組中的每一個(gè)成員依次執(zhí)行這個(gè)回調(diào)函數(shù)。顛倒數(shù)組中元素的順序。該參數(shù)是數(shù)組片斷結(jié)束處的數(shù)組下標(biāo)。會(huì)改變?cè)瓟?shù)組必需。整數(shù)，規(guī)定添加刪除項(xiàng)目的位置，使用負(fù)數(shù)可從數(shù)組結(jié)尾處規(guī)定位置。把數(shù)組轉(zhuǎn)換為本地?cái)?shù)組，并返回結(jié)果。

數(shù)組的轉(zhuǎn)化

Array.from將類似數(shù)組的對(duì)象和可遍歷的對(duì)象轉(zhuǎn)為真正的數(shù)組

var arr1 = Array.from(arrayLikeObj); //ES6

var arr2 = [ ].slice.call(arrayLikeObj): //ES5

Array.of將一組值轉(zhuǎn)換為數(shù)組

Array.of(3,11,7) // [3,11,7]

數(shù)組的復(fù)制

copyWithin將指定位置的成員復(fù)制到其它位置（會(huì)覆蓋原有成員），然后返回當(dāng)前數(shù)組。
此方法會(huì)修改原數(shù)組。

Array.prototype.copyWithin(target, start = 0, end = this.length)

接受三個(gè)參數(shù)

* target（必需）：從該位置開始替換數(shù)據(jù)
* start（可選）：從該位置開始讀取數(shù)據(jù)，默認(rèn)為0，如果是負(fù)值，表示倒數(shù)（右邊第一位為-1）
* end（可選）：到該位置前停止讀取數(shù)據(jù)，默認(rèn)為數(shù)組長(zhǎng)度，如果是負(fù)值，表示倒數(shù)

[1,2,3,4,5,6].copyWithin(0,2) // [3,4,5,6,5,6]

[1, 2, 3, 4, 5].copyWithin(0, -2, -1) // [4, 2, 3, 4, 5]

數(shù)組的查找

查找成員

find方法用于找出第一個(gè)符合條件的數(shù)組成員。它的參數(shù)是一個(gè)回調(diào)函數(shù)，數(shù)組中的每一個(gè)成員依次執(zhí)行這個(gè)回調(diào)函數(shù)。
如果找到第一個(gè)符合條件的成員，返回該成員。如果沒有符合條件的，則返回undefined

[1, 5, 10, 15].find(function(value, index, arr) {
  return value > 9;
}) // 10

find方法的回調(diào)函數(shù)接受三個(gè)參數(shù)
value：當(dāng)前值
index：當(dāng)前位置
arr：原數(shù)組

查找成員位置

[1, 5, 10, 15].findIndex(function(value, index, arr) {
  return value > 9;
}) // 2

indexOf也可以返回成員位置，如果不存在，則返回-1，所以很多時(shí)候也用來判斷成員是否存在

if (arr.indexOf(el) !== -1) {
    ... // el不存在數(shù)組中時(shí)執(zhí)行
}

-判斷成員是否存在

include方法判斷某個(gè)給定值是否存在數(shù)組中，返回布爾值。

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

數(shù)組的填充

使用fill()給定值填充數(shù)組

接受三個(gè)參數(shù)
target（必需）：用該數(shù)值填充數(shù)組
start（可選）：從該位置開始填充，不接收負(fù)值
end（可選）：到該位置前停止填充

["a", "b", "c"].fill(7, 1, 2) // ["a",7,"c"]

數(shù)組的遍歷取值

鍵名遍歷：keys( )
鍵值遍歷：values( )
鍵值對(duì)遍歷：entries( )

可以用for...of循環(huán)遍歷

for (let index of ["a", "b"].keys()) {
  console.log(index);}
// 0
// 1

for (let elem of ["a", "b"].values()) {
  console.log(elem);}
// "a"
// "b"

for (let [index, elem] of ["a", "b"].entries()) {
  console.log(index, elem);}
// 0 "a"
// 1 "b"

數(shù)組的元素操作

concat()連接兩個(gè)或更多的數(shù)組，并返回結(jié)果。
arr1.concat(arr2)

ES6中可利用擴(kuò)展運(yùn)算符直接寫成
[ ...arr1,...arr2]

join()把數(shù)組的所有元素放入一個(gè)字符串。元素通過指定的分隔符進(jìn)行分隔。

pop()刪除并返回?cái)?shù)組的最后一個(gè)元素

push()向數(shù)組的末尾添加一個(gè)或更多元素，并返回新的長(zhǎng)度。

reverse()顛倒數(shù)組中元素的順序。

shift()刪除并返回?cái)?shù)組的第一個(gè)元素

slice()
從某個(gè)已有的數(shù)組返回選定的元素（返回一個(gè)新數(shù)組）

arr.slice(start,end)

start

必需。規(guī)定從何處開始選取。如果是負(fù)數(shù)，那么它規(guī)定從數(shù)組尾部開始算起的位置。也就是說，-1 指最后一個(gè)元素，-2 指倒數(shù)第二個(gè)元素，以此類推。

end

可選。規(guī)定從何處結(jié)束選取。該參數(shù)是數(shù)組片斷結(jié)束處的數(shù)組下標(biāo)。如果沒有指定該參數(shù)，那么切分的數(shù)組包含從 start 到數(shù)組結(jié)束的所有元素。如果這個(gè)參數(shù)是負(fù)數(shù)，那么它規(guī)定的是從數(shù)組尾部開始算起的元素。

sort()
對(duì)數(shù)組的元素進(jìn)行排序（按照字符編碼的順序）

如果要按照數(shù)值大小對(duì)數(shù)字排序，必須使用一個(gè)排序函數(shù)arr.sort(sortNumber)

splice()刪除元素，并向數(shù)組添加新元素。會(huì)改變?cè)瓟?shù)組

arr.splice(index,howmany,item1,.....,itemX)

index

必需。整數(shù)，規(guī)定添加/刪除項(xiàng)目的位置，使用負(fù)數(shù)可從數(shù)組結(jié)尾處規(guī)定位置。

howmany

必需。要?jiǎng)h除的項(xiàng)目數(shù)量。如果設(shè)置為 0，則不會(huì)刪除項(xiàng)目。

item1, ..., itemX

可選。向數(shù)組添加的新項(xiàng)目。

toSource()返回該對(duì)象的源代碼。

toString()把數(shù)組轉(zhuǎn)換為字符串，并返回結(jié)果。

toLocaleString()把數(shù)組轉(zhuǎn)換為本地?cái)?shù)組，并返回結(jié)果。

unshift()向數(shù)組的開頭添加一個(gè)或更多元素，并返回新的長(zhǎng)度。

valueOf()返回?cái)?shù)組對(duì)象的原始值

參考阮一峰《ECMAScript 6 入門》：http://es6.ruanyifeng.com/#do...