[Javascript]Array Reduce的用法

學習Blog
Aug 19, 2021

--

自從成為前端之後,處理陣列是幾乎是基本中的基本,其中陣列方法reduce最讓我印象深刻;一開始都是使用foreach來處理陣列,後來發現reduce幾乎可以取代其他陣列方法。

如何用reduce?

先看看reduce的用法

arr.reduce(callback[accumulator, currentValue, currentIndex, array], initialValue)

accumulator:每次陣列迭代時所記錄的結果(必須有)

currentValue:目前陣列所迭代的元素(必須有)

currentIndex:目前陣列所迭代的元素index(不一定要有)

array:迭代的陣列對象(不一定要有)

initialValue:初始值(不一定要有)

聽起來很模糊,所以帶個例子比較好懂

累計

如果有一個只包含整數的陣列,要計算所有數字總和,要怎麼做?

一般的新手可能會這樣做

用reduce的話,等同於

如果不提供初始值initialValue,則陣列第一個元素,數字1會變成初始值

除了基本的累加外,reduce可以做很多事情

hashMap

Set(過濾資料)

組合陣列

組合物件

整理物件key值

動態組合(Promise)

對你沒看錯,promise也可以藉由reduce組合;如果有不確定的非同步步驟需要組合,除了使用遞迴(recursion)外,reduce更是一個優雅的解法

動態組合(ListNode — Linked List)

雖然剛開始使用Reduce會覺得很不好懂,但理解運用原理後,reduce可以寫出更好更簡潔的程式碼;下次遇到陣列問題,不妨可以嘗試看看:P

--

--