我在專案中es6中陣列的常用方法

2022-06-16 10:24:08 字數 2872 閱讀 1457

array.from():從乙個類似陣列或可迭代物件建立乙個新的,淺拷貝的陣列例項;典型的「類似陣列的物件」是函式的arguments物件,以及大多數 dom 元素集,還有字串。

array.from('foo');//["f", "o", "o"] 從string生成陣列

function foo()

foo([1,2,3])

//[1,2,3]

const set = new set(['foo', 'bar', 'baz', 'foo']);//set也可以

array.from(set);// [ "foo", "bar", "baz" ]

const map = new map([[1, 2], [2, 4], [4, 8]]);//map也行哦

array.from(map);// [[1, 2], [2, 4], [4, 8]]

array.of():將一系列值轉換成陣列;比如:

array.of(1,2,3)//會得到[1,2,3]

let items = array.of(1, 2);

console.log(items.length); // 2

console.log(items[0]); // 1

console.log(items[1]); // 2

items = array.of(2);

console.log(items.length); // 1

console.log(items[0]); // 2

array.find()與array.findindex() 這兩個是幹嘛的嘞,.find()是用於找出第乙個符合條件的陣列成員;而.findindex()是用於找出第乙個符合條件的陣列成員下標;使用方法如下:

[1, 2, 4, 8].find((n) => n > 4)   // 8

[1, 2, 4, 8].findindex((n) => n > 4) // 3

陣列例項的 entries(),keys() 和 values();這三個方法是在遍歷的時候才會用到;分別是遍歷【下標、值】、下標和值;使用方法如下:

const array=[7,8,9]

for(let [index, item] of array.entries())

// 0 7

// 1 8

// 2 9

for(let index of array.keys())

// 0

// 1

// 2

for(let item of array.values())

// 7

// 8

// 9

array.includes()方法;此方法返回乙個布林值,用於判斷陣列裡是否有我們要找的,某個值;與indexof方法類似(不過indexof返回的是-1或者下標)。使用方法如下:

[1, 2, 3].includes(2)     // true

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

[1, 2, nan].includes(nan) // true 這裡需要注意nan的查詢;我們如果使用indexof方法去查詢,會得到什麼值,是-1還是2

array..reduce()方法;此方法是陣列的歸併方法;可同時將前面陣列項遍歷產生的結果與當前遍歷項進行運算;(我也是通過自己實踐慢慢理解的);

完整的array.reduce(function(pre, cur, currentindex, arr), initialvalue);一看,哇!這麼多引數啊?幹啥呢??
pre:必需。初始值initialvalue, 或者計算結束後的返回值。

cur: 必需。當前元素

currentindex: 可選。當前元素的索引,如果沒有提供initialvalue,reduce 會從索引1的地方開始執行 callback 方法,跳過第乙個索引。如果提供initialvalue,從索引0開始 //重點

arr: 可選。當前元素所屬的陣列物件。

其實我們常用的引數只有兩個,pre和cur;下面我們來看下怎麼回事兒

var result = [10,20,30];

var sum = result.reduce((pre, cur)=> , 0);

console.log(sum) //60 由於傳入了初始值0,所以開始時prev的值為0,cur的值為陣列第一項10,相加之後返回值為10作為下一輪**的total值,然後再繼續與下乙個陣列項相加,以此類推,直至完成所有陣列項的和並返回。

還可以拉平二維陣列哦

let arr = [[0, 1], [2, 3], [4, 5]]

let newarr = arr.reduce((pre,cur)=>,)

console.log(newarr); // [0, 1, 2, 3, 4, 5]

陣列去重?也行

let arr = [1,2,3,3,3,1]

let newarr = arr.reduce((pre,cur)=>else

},)console.log(newarr);// [1, 2, 3]

我在專案中常用的es6+的陣列方法就介紹完了,有些方法可能沒有講到,我有些沒有用過有些用過一兩次,就不獻醜了,希望對大家有幫助

專案中常用的ES6

看 及注釋就懂了 把es6 es2015 轉換為es5 解構賦值 let dessert,drink,fruit breakfast const breakfast let breakfast 字串 陣列展開符 利用 array 的 concat 實現 let food rice breakfast...

專案中常用的ES6語法總結

fill 陣列填充 array.fill value 會對陣列填充陣列成員,填充長度等於陣列長度 array.fill value,start,end 可以使用指定的元素填充陣列 它接受三個引數 const filldata data return data a b c fill 7 7,7,7 n...

ES6中陣列的常用方法

1 fill的用法 宣告指定陣列長度,並填充對應資料 const arr new array 3 fill agwenbi console.log arr agwenbi agwenbi agwenbi 2 from的用法 from,從乙個類似陣列或可迭代物件建立乙個新的,淺拷貝的陣列 let st...