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...