?1、Array.map()
????此方法是將數(shù)組中的每個元素調(diào)用一個提供的函數(shù)妆兑,結(jié)果作為一個新的數(shù)組返回,并沒有改原來的數(shù)組??
? ??//有三個參數(shù)
? ? 第一個是遍歷的數(shù)組內(nèi)容
? ? 第二個是參數(shù)是對應(yīng)的數(shù)組索引
? ? 第三個參數(shù)是數(shù)組本身
????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ù)組
?2. Array.forEach()
? ??此方法是將數(shù)組中的每個元素執(zhí)行傳進(jìn)提供的函數(shù),沒有返回值,注意和map方法區(qū)分
????//有三個參數(shù)
? ? 第一個是遍歷的數(shù)組內(nèi)容
? ? 第二個是參數(shù)是對應(yīng)的數(shù)組索引
? ? 第三個參數(shù)是數(shù)組本身地
????let?arr = [1, 2, 3, 4, 5]
? ? arr.forEach(function(value,index,arr){
? ? ? ? console.log(value+1)
????????)
???// arr = [1, 2, 3, 4, 5]? 數(shù)組未改變,注意和map區(qū)分
3.Array.filter()
次方法是對數(shù)組中所有元素進(jìn)行判斷秉沼,將滿足條件的元素作為一個新的數(shù)組返回
同理有三個參數(shù)
let arr = [1,2,3,4,5]
let newArr = arr.filter(x=>x>2)
//newArr [3,4,5]
4.Array.every()
此方法是對數(shù)組中所有元素進(jìn)行判斷返回一個布爾值,如果所有元素都滿足判斷條件矿酵,則返回true氧猬,否則為false,不改變原來數(shù)組
同理有三個參數(shù)
let arr = [1,2,3,4]
arr.every(x=>x>=1) // true
arr.every(x=>x>2) // false
5.Array.some()
次方法是判斷數(shù)組中是否有滿足條件的選項坏瘩,只要一項滿足條件就返回true 否則返回false? 不改變原來數(shù)組
同理有三個參數(shù)
let arr = [1,2,3,4]
arr.some(x=>x>1)? //true
arr.some(x=>x>5) // false
6.Array.reduce()
次方法是數(shù)組中每一個元素一次執(zhí)行回調(diào)函數(shù),不包括數(shù)組中被刪除或者未被賦值的元素
有四個參數(shù)
????1漠魏、previousValue (上一次調(diào)用回調(diào)返回的值倔矾,或者是提供的初始值(initialValue))
????2、currentValue (數(shù)組中當(dāng)前被處理的元素)
????3柱锹、index (當(dāng)前元素在數(shù)組中的索引)
????4哪自、array (調(diào)用 reduce 的數(shù)組)
arr.reduce(callback,[initialValue])
例1
let arr = [1, 2, 3, 4];
let sum = arr.reduce(function(prev, cur, index, arr) {
????console.log(prev, cur, index);
????return prev + cur;
????})
console.log(arr, sum);
打印結(jié)果:
1 2 1
3 3 2
6 4 3
[1, 2, 3, 4] 10
這里可以看出,上面的例子index是從1開始的禁熏,第一次的prev的值是數(shù)組的第一個值壤巷。數(shù)組長度是4,但是reduce函數(shù)循環(huán)3次瞧毙。
例2
var arr = [1, 2, 3, 4];
var sum = arr.reduce(function(prev, cur, index, arr) {
????console.log(prev, cur, index);
????return prev + cur;
????}胧华,0) //注意這里設(shè)置了初始值
console.log(arr, sum);
打印結(jié)果:
0 1 0
1 2 1
3 3 2
6 4 3
[1, 2, 3, 4] 10?
這個例子index是從0開始的,第一次的prev的值是我們設(shè)置的初始值0宙彪,數(shù)組長度是4矩动,reduce函數(shù)循環(huán)4次。
結(jié)論:如果沒有提供initialValue释漆,reduce 會從索引1的地方開始執(zhí)行 callback 方法悲没,跳過第一個索引。如果提供initialValue男图,從索引0開始示姿。
注意:如果這個數(shù)組為空甜橱,運用reduce是什么情況?
var arr = [];
var sum = arr.reduce(function(prev, cur, index, arr) {
console.log(prev, cur, index); return prev + cur;})
//報錯栈戳,"TypeError: Reduce of empty array with no initial value"
但是要是我們設(shè)置了初始值就不會報錯岂傲,如下:
var arr = [];
var sum = arr.reduce(function(prev, cur, index, arr) {
console.log(prev, cur, index); return prev + cur;},0)
console.log(arr, sum); // [] 0
所以一般來說我們提供初始值通常更安全
//reduce 高級用法
1 計算數(shù)組中每個元素出現(xiàn)的次數(shù)
let?names?=?['aa','bb','cc','dd','aa','dd']????????
let?NewName?=?names.reduce(function(pre,cut){?????????
???if(cut?in??pre){??????????????
??????pre[cut]++????????????
????}else{????
????????????pre[cut]?=?1??????
??????}????????????return?pre????????},{})????
????console.log(NewName)?//['aa':2,'bb':1,'cc':1,'dd':2]
2 數(shù)組去重
let?arr?=?[1,2,3,4,3,2,1,5,4,6]?????
??let?newArr?=?arr.reduce(function(pre,cut){????????
????if(!pre.includes(cut)){??????????????
??????return?pre.concat(cut)????????????
????}else{????????????????
????????????return?pre?????????
???????}???????},[])??????
?console.log(newArr)?
3將二維數(shù)組轉(zhuǎn)化為一維數(shù)組
????let?arr?=?[1,2,3,4,3,2,1,5,4,6]???????
????let?newArr?=?arr.reduce(function(pre,cut){????
????????if(!pre.includes(cut)){????
????????????return?pre.concat(cut)????????
????}else{????????????????return?pre??????????
??????????}??????
?????},[])???
????console.log(arr.includes(2,3))?
4將二維數(shù)組轉(zhuǎn)化為一維數(shù)組
let?arr?=?[[1,2,3],[2,3,4],[5,6]]??????
??let?newArr?=?arr.reduce(function(pre,cut){???????????
?return?pre.concat(cut)?????
???},[])??????
??console.log(newArr)?
4將多維數(shù)組轉(zhuǎn)化為一維數(shù)組
let?arr?=?[[0,?1],?[2,?3],?[4,[5,6,7]],55]?????
???const?fnc?=?function(arr){???????
?????return?arr.reduce(function(pre,cut){????????
???????return?pre.concat(Array.isArray(cut)?fnc(cut):cut)??????????
??????},[])????????}???????
?let?newArr?=?fnc(arr)????????
console.log(newArr)?
5對象屬性求和
let?result?=?[??????????
? ? ? ? ?{? ? ? ? ? ? ? ? ?subject:'math',????????????????score:90????????????},? ? ? ? ? ? ? ? ? ?????????{????????????????subject:'chinese',????????????????score:80????????????},? ????????{????????????????subject:'english',????????????????score:80????????????}??
??????]????????
const?sum?=?result.reduce((pre,cut)=>pre+cut.score,0)????????
console.log(sum)?
7 sort()
數(shù)組排序 默認(rèn)升序 按照字母編碼排序? ?
有一個參數(shù)為函數(shù)
let?array?=?[1,3,4,5,32,345,6]?????
???console.log(array.sort())? ? ? ?//[1, 3, 32, 345, 4, 5, 6]
??console.log(array.sort((pre,cut)=>pre>cut?1:-1)) //?[1, 3, 4, 5, 6, 32, 345]