數(shù)組的reduce方法詳細(xì)解

來源 | https://www.cnblogs.com/cythia/archive/2021/06/06/14856551.html
前言
reduce方法
arr.reduce((prev,cur,index,arr)=>{},init)
prev:表示上一次調(diào)用回調(diào)時的返回值,或者初始值init
cur:表示當(dāng)前正在處理的數(shù)組元素
index:表示正在處理的數(shù)組元素的索引,若提供init值,則索引為0,否則索引為1
init: 表示初始值
案例
數(shù)組求和
const arr = [1,2,3,4,5,6,7]const sum = arr.reduce((pre,cur)=>{return pre +cur})console.log(sum)
數(shù)組求和方法是這個reduce方法最常見的使用案例了,但是很多人只知道返回pre + cur就能返回總和,如果我稍微把這個方法下面這樣呢。
const arr = [1,2,3,4,5,6,7]const sum = arr.reduce((pre,cur)=>{return pre +cur},2)console.log(sum)
大家覺得結(jié)果還是一樣的嗎
答案顯然是否定的,下面我給大家解釋解釋:
首先我們要明確的時候,pre表示的是上一次回調(diào)時的返回值,或者是初始值init。
在我們第一次調(diào)用的時候,第一個案例是沒有設(shè)置init的值,在沒有設(shè)置init值的情況下,index的索引值是從1,其實(shí)是第一次的時候就隱式調(diào)用了pre+cur,你可以理解為是在背后做了pre是0+cur:1。
我們在控制臺看到的就是整個計算過程是index是1-6。
在第二個案例中,init設(shè)置的值是2,那么就是代表pre的初始值就是2,那么第一次的時候,index是從0開始的,第一次調(diào)用返回的就是`2+arr[1]`=3,整個過程index執(zhí)行是從0-6,共7次
結(jié)果:第一個是28,第二個因?yàn)槌跏贾稻褪?,即從2開始加,所以是30
計算數(shù)組中每個元素出現(xiàn)的次數(shù)。
let person = ['李白','雅典娜','安琪拉','李白','諸葛亮','安琪拉']let nameObj = person.reduce((pre,cur) =>{if( cur in pre){pre[cur]++}else{pre[cur] = 1}return pre}, {})console.log(nameObj) // {李白: 2, 雅典娜: 1, 安琪拉: 2, 諸葛亮: 1}
數(shù)組扁平化
const arr2 = [1,[2,[3,[4,5]]],6]const newArr = (arr) => {return arr.reduce((pre,cur)=>{return pre.concat(Array.isArray(cur) ? newArr(cur) : cur)},[])}console.log(newArr(arr2)) // [1, 2, 3, 4, 5, 6]
這個方法是使用了遞歸的方法結(jié)合reduce實(shí)現(xiàn)的。當(dāng)然實(shí)現(xiàn)數(shù)組扁平化的方式不止這一種,后面我會另起一篇給大家列舉數(shù)組扁平化的幾種方法。
數(shù)組去重
const arr3 = [1,2,3,4,5,3,2,1,6,4,7,8]const resultArr = arr3.reduce((pre,cur)=>{if(!pre.includes(cur)){return pre.concat(cur)}else{return pre}},[])console.log(resultArr)
學(xué)習(xí)更多技能
請點(diǎn)擊下方公眾號
![]()

評論
圖片
表情
