簡單介紹

reduce可以對數(shù)組中的元素從index 0到length-1依次處理，每個元素的處理結果會作為處理下一個元素時所需要的參數(shù)，當所有元素處理結束后返回累積結果。

var a = [1,2,3,4]; 
a.reduce(function(a,b,index,array){ 
  console.log(a + " and " + b + " index:" + index);  
  return a+b; 
},1);
******************************************************
1 and 1 index:0
2 and 2 index:1
4 and 3 index:2
7 and 4 index:3
11

上述例子在chrome的console下運行后可看到結果，該例子傳入了兩個參數(shù)，callback為單純的累加函數(shù)，initialValue為1
為什么會出現(xiàn)log這樣的結果呢？接下來分析一下reduce的兩個參數(shù)

參數(shù)callback與initialValue

官方給出的reduce使用方法如下

 arr.reduce(callback[,initialValue])

接收兩個參數(shù)，第一個參數(shù)callback為必選，第二個initialValue為可選

callback

假設當前場景為正在對數(shù)組的第n元素進行callback處理

• accumulator：累加器，該參數(shù)的值為第n-1個元素處理后的返回值
• currentValue：該參數(shù)值為第n個元素的值
• currentIndex：第n個元素的index
• array：當前數(shù)組的引用

initialValue

callback的第一個參數(shù)為第n-1個參數(shù)處理后的返回值，可是如果n=1(即剛對第一個元素進行callback處理)時accumulator值是多少呢？
initialValue作用就在于解決第一次處理時accumulator值的問題，如果傳入了initialValue，那么第一次callback中accumulator值等于initialValue

接下來根據(jù)例子來看initialValue存在與否對reduce執(zhí)行流程的影響

var a = [1,2,3,4]; 
a.reduce(function(a,b,index,array){ 
  console.log(a + " and " + b + " index:" + index);  
  return a+b; 
});   //可選參數(shù)initialValue未傳入
**************************************************************
1 and 2 index:1
3 and 3 index:2
6 and 4 index:3
10

與文章開篇的第一個例子對比可以發(fā)現(xiàn)，傳入initialValue時callback執(zhí)行了4次，未傳入則執(zhí)行了3次，數(shù)組明明有4個元素，這是什么原因呢？

reduce官方介紹說的非常清楚。

initialValue.png

應用

每一個新技術的出現(xiàn)都是為了解決一類問題，reduce也不例外，當我們想將數(shù)組元素或者元素中的某些內容累積時，reduce可以很方便的解決我們的問題。
具體應用請參考官方文檔