reduce的原理
簡介
在紅寶書中，將這個方法定義為數組的歸並方法，這個方法和迭代方法（map,forEach,filter...）一樣，都會對數組進行遍歷，reduce與他們不同的是函數的第一個參數得到的是迭代計算后的效果（看不懂沒關系，繼續往下看就會懂了）
語法
這個方法接收兩個參數：
-
要執行的函數，要執行的函數中也可傳入參數，分別為
- prev：上次調用函數的返回值
- cur：當前元素
- index：當前元素索引
- arr：被遍歷的數組
- 函數迭代的初始值
舉例
- 沒有設置函數的初始迭代值
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);運行結果：
分析：
我們可以看到，在這里reduce的作用就是對這個數組進行求和，迭代了3次，函數迭代的初始值是1，也就是默認值（數組的第一項），prev的值是每次計算后的值，現在理解了吧！
- 設置初始迭代值
let arr = [1, 2, 3, 4]; let sum = arr.reduce(function(prev, cur, index, arr) { console.log(prev, cur, index); return prev + cur; },5) console.log(arr, sum);運行結果：
分析：
這里我們添加了一個初始的迭代值，也就是讓prev從5開始計算，可以看到，這里迭代了4次，結果也加上了初始值。
reduce的應用
初級應用
最常見的應用一般就是求和以及求乘積了，比如說下面的例子：
let arr = [1,2,3,4,5] console.log(arr.reduce((a,b) => a + b))//15 console.log(arr.reduce((a,b) => a * b))//120高級應用
計算數組中每個元素出現的次數
let arr = ['name','age','long','short','long','name','name'] let arrResult = arr.reduce((pre,cur) =>{ console.log(pre,cur) if(cur in pre){ pre[cur]++ }else{ pre[cur] = 1 } return pre },{}) console.log(arrResult)//結果：{name: 3, age: 1, long: 2, short: 1} 運行結果：（第一個console.log）
分析：
大概的解釋一下，運行過程是這樣的：
- 由於設置了迭代初始值，pre的第一個值是一個空對象，此時cur為name，然后進行判斷，發現在pre中沒有name屬性，所以就將name對應的屬性值賦為1；
- 后面沒有重復的是一樣的道理，如果碰到重復值，就會將該屬性值加1，這樣就能計算元素重復的次數了。（有沒有覺得很神奇呀~）
去除數組中重復的元素
let arrResult = arr.reduce((pre,cur) =>{ if(!pre.includes(cur)){ pre.push(cur) } return pre; },[]) console.log(arrResult)//結果：["name", "age", "long", "short"] 分析：
這里主要是借助迭代功能實現數組的擴展，判斷當前元素是否已經添加到數組中，如果不存在就從尾部添加，這個方法在去重方法中應該算比較簡單高效的。
對對象的屬性求和
let person = [ { name: 'xiaoming', age: 18 },{ name: 'xiaohong', age: 17 },{ name: 'xiaogang', age: 19 } ] let result = person.reduce((a,b) =>{ a = a + b.age; return a; },0) console.log(result)//結果：54分析：
這里主要就是利用reduce第一個參數是迭代，可以通過初始化這個參數的數據類型，達到想實現的效果。
原文鏈接：https://segmentfault.com/a/1190000017420042