資訊專欄INFORMATION COLUMN
摘要：例使用多個類別所以如果這都是關于卡路里的，為什么會有這么多不同的飲食呢我不打算深究營養科學，但這里有一個概括性的總結對于最佳減肥方法有很多分歧。
想閱讀更多優質文章請猛戳GitHub博客,一年百來篇優質文章等著你！
JavaScript中的reduce方法為您提供了一種簡單的方法來獲取值數組并將它們組合成一個值，或者根據多個類別對數組求和。
哇，一句話說得太多了，讓我們一步一步來吧！
當然，你可以使用 for 循環遍歷數組并對每個值執行特定操作。但是，如果你不使用 filter()、map() 和reduce() 等方法，那么你的代碼將變得更加難以閱讀。其他開發人員需要徹底閱讀每個循環才能理解其目的,而且容易出現更多的 bug，因為你需要創建更多的變量來跟蹤單個值。
Filter 方法接受初始數組中的所有元素，并且只允許某些元素進入最終數組
Map 方法在初始數組中的每個元素上運行一個函數，然后將其存儲在最終數組中。
而 reduce 方法將初始數組中的元素組合成最終值或值數組。
我意識到這有點像節食。從非常簡單的方法，如計算卡路里，到更復雜的飲食，如 Atkins 減肥法或稱體重計(WeightWatchers)，目標是將你一天中可能吃的所有食物提煉成一個(或多個)值，看看你是否在減肥的軌道上。
用 For 循環模擬Reduce下面是使用for循環快速顯示reduce()功能的方法。假設你有一個包含你一天中吃過的5種不同食物的卡路里計數的數組，你想知道你總共消耗了多少卡路里,代碼如下：
這很簡單，你創建一個變量來保存最終數量，然后在運行數組時添加它。但是，你仍然需要引入一個新變量，并且循環沒有提供關于循環目的的線索。
一個簡單的Reduce示例讓我們學習如何使用reduce()方法實現相同的目標。
reduce() 方法接收一個函數作為累加器，數組中的每個值（從左到右）開始縮減，最終計算為一個值。對空數組是不會執行回調函數的。
所以 reduce 有一些內存的概念。在遍歷數組中的每一項時，sum參數將跟蹤值。在前面的例子中，我們必須在循環范圍之外聲明一個新變量來“記住”這些值。
這與for()之間的可讀性似乎沒有太大區別。但是，當需要遍歷數百行代碼時，reduce 會讓你快速了解代碼塊的用途。
例2 - 使用對象到目前為止，我們只舉例一維數組。但是，如果您可以遍歷一個都是數字的數組，那么你也可以遍歷一個都是對象的數組。讓我們給每個元素加一個名字，這樣我們就能知道我們一天到底吃了什么。
你早餐吃了一份牛排，一些水果，然后午餐吃了一些沙拉和薯條，最后晚餐吃了冰淇淋，真是糟糕的一天！
希望你們能看到整個數組的流動。當我們研究每一種元素時，總熱量的總和（ sum）就代表了一天所消耗的總熱量，主要是把這些數值放進一個大桶里——一天的卡路里量。
例3 - 使用多個類別所以如果這都是關于卡路里的，為什么會有這么多不同的飲食呢? 我不打算深究營養科學，但這里有一個概括性的總結——對于 “最佳” 減肥方法有很多分歧。有些人鼓勵你只計算卡路里，而另一些人則關注蛋白質、碳水化合物、脂肪和其他任何因素。
讓我們設想一下，你希望更改代碼，以便能夠基于任何常見的節食系統評估您的飲食。你需要追蹤每種食物的碳水化合物和脂肪，然后你需要在最后統計一下，這樣你就能算出你在每個類別中消耗了多少克，以下我們的食品（有虛假的營養價值）：
現在，我們需要運行reduce()方法。但是，它不能在一個值中被跟蹤，我們想保留我們的類別。因此，我們的累加器需要是一個與數組具有相同類型的對象。
下面是這個過程的一個GIF圖片：
在遍歷數組每個項時，你將更改對象中特定屬性的值，如果該對象尚未具有正確名稱的屬性，則將創建該對象，如下：
我們使用 bucket 作為對象，根據屬性名對值進行分類。我們使用 += 操作符為來自 foods 數組的對象中的每個值添加到適當的bucket。請注意保存值的 key 的名字，這里是隨意的，這是因為它是無關緊要的——我們只是想要數字，這樣我們就可以分析你一天飲食的成功。
如你所見，在我們的輸出中有一個問題，結果包含一個 name 字段為“steak”，我們并不想存儲該字段。因此，我們需要指定另一個參數——初始值。
這個參數在回調之后出現，我們希望將 calories、carbs 和 fat 字段初始化為0，以便我們的 reduce 方法知道這是我們將用于 bucket 參數的唯一三個鍵/值對，代碼如下：
原文：https://codeburst.io/javascri...
你的點贊是我持續分享好東西的動力，歡迎點贊！
歡迎加入前端大家庭，里面會經常分享一些技術資源。文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/100026.html
摘要：簡單例子一個較為常用的場景就是累加或累乘輸出數組元素的乘積輸出數組元素的乘積簡寫形式輸出數組元素的乘積形式，營造復雜的逼格用在數組降維扁平化處理的例子中注方法用于連接兩個或多個數組。 看到一個提問的回答巧妙地使用了map/reduce操作，很優雅，所以來學習和總結一下javascript自帶的map/reduce的使用技巧，文章不會講的很深，純當科普一下知識點，如有解釋的不正確的地方，...
摘要：過程是一個計算單元，計算是通過通訊來完成的。標題的表達式里還有一個符號，表示一個無行為的過程。一個過程的是它和外部產生行為交互的唯一方式。所以如果兩個過程需要通過一個交互，這個必須在兩個過程中都是，其中一方用于發送，另一方用于接收。 這篇文章的標題是一個π表達式，結尾是一段JavaScript代碼，和這個表達式的含義完全一致，或者說，完成了這個表達式的估值。 π演算（π calculu...
摘要：原文鏈接原文作者函數式編程這篇文章是介紹函數式編程的四篇文章中的第二篇。這些部分被使用的越來越頻繁，人們把他們放到一個函數式編程的庫里面，有一些流行的庫包括未亡待續閱讀下一節原文地址歡迎關注 showImg(https://segmentfault.com/img/bVtSez); tips 原文鏈接: http://jrsinclair.com/articles/2016/gentl...
摘要：該方法接受兩個參數，一個是元素每一項執行的回調函數，一個是可選參數，回調函數運行時的值。 今天我們來繼續 Javascript 數組系列的文章，上文 《Javascript數組系列二之迭代方法1》 我們說到一些數組的迭代方法，我們在開發項目實戰的過程中熟練的使用可以大大提高我們的開發效率以及數據的處理。接下來我們繼續來講解其他的一些迭代的方法。 天也黑了，時間也不早了，話不多說，擼起袖...
摘要：循環數組每一項數組下標當前調用數組本身可選初始值，作為回調函數第一個參數的默認值，也是每次回調的返回值，見代碼首頁問題轉化為數組首頁問題轉化后效果這個栗子來自配置路由時遇到的，當時也是優化了好幾個版本。 reduce callback（一個在數組中每一項上調用的函數，接受四個參數：）previousValue（上一次調用回調函數時的返回值，或者初始值）currentValue（當前正...
閱讀 1785·2023-04-26 00:47
閱讀 1543·2021-11-11 16:55
閱讀 2597·2021-09-27 14:04
閱讀 3548·2021-09-22 15:58
閱讀 3554·2021-07-26 23:38
閱讀 2129·2019-08-30 13:47
閱讀 1979·2019-08-30 13:15
閱讀 1142·2019-08-29 17:09
