從事前端已經(jīng)兩年的時間蝌诡,發(fā)現(xiàn)我們在原生開發(fā)就是在玩數(shù)組的操作,今天在這個我把數(shù)組常用的方法進(jìn)行終結(jié)枫吧,希望對從事前端的小伙伴有一些幫助
Array.map()
此方法是將數(shù)組中的每個元素調(diào)用一個提供的函數(shù)浦旱,結(jié)果作為一個新的數(shù)組返回,并沒有改變原來的數(shù)組
1
2
3
4
let?arr = [1, 2, 3, 4, 5]
????let?newArr = arr.map(x => x*2)
????//arr= [1, 2, 3, 4, 5]?? 原數(shù)組保持不變
????//newArr = [2, 4, 6, 8, 10] 返回新數(shù)組
Array.forEach()
此方法是將數(shù)組中的每個元素執(zhí)行傳進(jìn)提供的函數(shù)九杂,沒有返回值颁湖,注意和map方法區(qū)分
1
2
3
let?arr = [1, 2, 3, 4, 5]
???num.forEach(x => x*2)
???// arr = [1, 2, 3, 4, 5]? 數(shù)組改變,注意和map區(qū)分
Array.filter()
此方法是將所有元素進(jìn)行判斷,將滿足條件的元素作為一個新的數(shù)組返回
1
2
3
4
let?arr = [1, 2, 3, 4, 5]
????const isBigEnough = value = value >= 3
????let?newArr = arr.filter(isBigEnough )
????//newNum = [3, 4, 5] 滿足條件的元素返回為一個新的數(shù)組
Array.every()
此方法是將所有元素進(jìn)行判斷返回一個布爾值例隆,如果所有元素都滿足判斷條件甥捺,則返回true,否則為false:
let?arr = [1, 2, 3, 4, 5]
????const isLessThan4 = value => value < 4
????const isLessThan6 => value => value < 6
????arr.every(isLessThan4 )?//false
????arr.every(isLessThan6 )?//true
Array.some()
此方法是將所有元素進(jìn)行判斷返回一個布爾值裳擎,如果存在元素都滿足判斷條件涎永,則返回true,若所有元素都不滿足判斷條件鹿响,則返回false:
let?arr= [1, 2, 3, 4, 5]
????const isLessThan4 = value => value < 4
????const isLessThan6 = value => value > 6
????arr.some(isLessThan4 )?//true
????arr.some(isLessThan6 )?//false
Array.reduce()
此方法是所有元素調(diào)用返回函數(shù)羡微,返回值為最后結(jié)果,傳入的值必須是函數(shù)類型:
let?arr = [1, 2, 3, 4, 5]
???const add = (a, b) => a + b
???let?sum = arr.reduce(add)
???//sum = 15? 相當(dāng)于累加的效果
???與之相對應(yīng)的還有一個 Array.reduceRight() 方法,區(qū)別是這個是從右向左操作的
Array.push()
此方法是在數(shù)組的后面添加新加元素惶我,此方法改變了數(shù)組的長度:
Array.pop()
此方法在數(shù)組后面刪除最后一個元素妈倔,并返回數(shù)組,此方法改變了數(shù)組的長度:
let?arr = [1, 2, 3, 4, 5]
????arr.pop()
????console.log(arr)?//[1, 2, 3, 4]
????console.log(arr.length)?//4
Array.shift()
此方法在數(shù)組后面刪除第一個元素绸贡,并返回數(shù)組盯蝴,此方法改變了數(shù)組的長度:
let?arr = [1, 2, 3, 4, 5]
????arr.shift()
????console.log(arr)?//[2, 3, 4, 5]
????console.log(arr.length)?//4?
Array.unshift()
此方法是將一個或多個元素添加到數(shù)組的開頭毅哗,并返回新數(shù)組的長度:
let?arr = [1, 2, 3, 4, 5]
????arr.unshift(6, 7)
????console.log(arr)?//[6, 7, 1, 2, 3, 4, 5]
????console.log(arr.length)?//7?
Array.isArray()
判斷一個對象是不是數(shù)組,返回的是布爾值
Array.concat()
此方法是一個可以將多個數(shù)組拼接成一個數(shù)組:
let?arr1 = [1, 2, 3]
??????arr2 = [4, 5]
??let?arr = arr1.concat(arr2)
??console.log(arr)//[1, 2, 3, 4, 5]
Array.toString()
此方法將數(shù)組轉(zhuǎn)化為字符串:
let?arr = [1, 2, 3, 4, 5];
???let?str = arr.toString()
???console.log(str)// 1,2,3,4,5
Array.join()
? 此方法也是將數(shù)組轉(zhuǎn)化為字符串:
let?arr = [1, 2, 3, 4, 5];
???let?str1 = arr.toString()
???let?str2 = arr.toString(',')
???let?str3 = arr.toString('##')
???console.log(str1)// 12345
???console.log(str2)// 1,2,3,4,5
???console.log(str3)// 1##2##3##4##5
通過例子可以看出和toString的區(qū)別捧挺,可以設(shè)置元素之間的間隔~
15.Array.splice(開始位置虑绵, 刪除的個數(shù),元素)
萬能方法闽烙,可以實(shí)現(xiàn)增刪改:
let?arr = [1, 2, 3, 4, 5];
?????let?arr1 = arr.splice(2, 0?'haha')
?????let?arr2 = arr.splice(2, 3)
?????let?arr1 = arr.splice(2, 1?'haha')
?????console.log(arr1)?//[1, 2, 'haha', 3, 4, 5]新增一個元素
?????console.log(arr2)?//[1, 2] 刪除三個元素
?????console.log(arr3)?//[1, 2, 'haha', 4, 5] 替換一個元素