ES6學習筆記陣列

一、陣列擴充套件建立

1.array.from方法用於將兩類物件轉為真正的陣列：類似陣列的物件（array-like object）和可遍歷（iterable）的物件（包括es6新增的資料結構set和map），可以接受第二個引數，用來對每個元素進行處理，將處理後的值放入返回的陣列。

2.array.of方法用於將一組值，轉換為陣列，彌補陣列建構函式array()的不足。

3.array方法沒有引數、乙個引數、三個引數時，返回結果都不一樣。只有當引數個數不少於2個時，array()才會返回由引數組成的新陣列。引數個數只有乙個時，實際上是指定陣列的長度

array.from([1, 2, 3])
等同於array.of(1, 2, 3)

二、查詢

find()：用於找出第乙個符合條件的陣列元素。

findindex：返回第乙個符合條件的陣列元素的位置，如果所有元素都不符合條件，則返回 -1 。

let list = [1,2,3,4]
list.find(item=>item>3) //4
list.findindex(item=>item>3) //3
let arr = [,,
,] arr.find(item=>item.id==1) //
arr.findindex(item=>item.id==1) //0

三、填充

fill()：將一定範圍索引的陣列元素內容填充為單個指定的值。

copywithin()：將一定範圍索引的陣列元素修改為此陣列另一指定範圍索引的元素。

[1,2,3,4].fill(0,1,2) // [1, 0, 3, 4]
[1, 2, 3, 4, 5].copywithin(0, 3, 4) // 將3號位複製到0號位, [4, 2, 3, 4, 5]

四、遍歷陣列

keys() ：對鍵名的遍歷

values()：對鍵值的遍歷

entries()：對鍵值對的遍歷

for (let index of ['a', 'b'].keys()) 
// 0
// 1
for (let elem of ['a', 'b'].values()) 
// 'a'
// 'b'
for (let [index, elem] of ['a', 'b'].entries()) 
// 0 "a"
// 1 "b"

五、包含

includes()：陣列是否包含指定值。

注意：與 set 和 map 的 has 方法區分；set 的 has 方法用於查詢值；map 的 has 方法用於查詢鍵名。

// 引數1：包含的指定值
[1, 2, 3].includes(1); // true
// 引數2：可選，搜尋的起始索引，預設為0
[1, 2, 3].includes(1, 2); // false
// nan 的包含判斷
[1, nan, 3].includes(nan); // true

六、巢狀陣列轉一維陣列

flat()：方法將子陣列的成員取出來，新增在原來的位置，flat() 方法的引數寫成乙個整數，表示想要拉平的層數，預設為1。

flatmap()：方法對原陣列的每個成員執行乙個函式（相當於執行 array.prototype.map() ），然後對返回值組成的陣列執行 flat() 方法。該方法返回乙個新陣列，不改變原陣列。

[1, 2, [3, [4, 5]]].flat()  // [1, 2, 3, [4, 5]]
[1, 2, [3, [4, 5]]].flat(2) // [1, 2, 3, 4, 5]
[1, [2, [3]]].flat(infinity) //不管有多少層巢狀，都要轉成一維陣列 [1, 2, 3]
[1, 2, , 4, 5].flat() // 跳過空位 [1, 2, 4, 5]
// 相當於 [[2, 4], [3, 6], [4, 8]].flat()
[2, 3, 4].flatmap((x) => [x, x * 2]) // [2, 4, 3, 6, 4, 8]
// 相當於 [[[2]], [[4]], [[6]], [[8]]].flat()
[1, 2, 3, 4].flatmap(x => [[x * 2]]) // [[2], [4], [6], [8]]

七、合併陣列

[...[1, 2],...[3, 4]] //[1, 2, 3, 4]

八、複製陣列

let arr = [1, 2]
let arr1 = [...arr] // [1, 2]
// 陣列含空位
let arr2 = [1, , 3]
let arr3 = [...arr2] // [1, undefined, 3]

ES6學習筆記陣列

ES6學習筆記陣列的擴充套件

es6學習筆記資料解構

es6隨手記陣列篇

ES6學習筆記 陣列

ES6學習筆記 陣列的擴充套件

es6學習筆記 資料解構

es6隨手記 陣列篇

相關推薦

ES6學習筆記陣列

ES6學習筆記陣列的擴充套件

es6學習筆記資料解構

es6隨手記陣列篇