JavaScript中的reduce()的使用方法

JavaScript中的reduce()的使用方法？這個問題可能是我們?nèi)粘W(xué)習或工作經(jīng)常見到的。希望通過這個問題能讓你收獲頗深。下面是小編給大家?guī)淼膮⒖純?nèi)容，讓我們一起來看看吧！

 reduce()是將數(shù)組數(shù)據(jù)的每個元素累積為一個值的最佳方法。

下面我們來看具體的內(nèi)容。

假設(shè)我們有一個這樣的數(shù)組：

var numbers = [1,2,3,4,5,6,7,8,9];

var strings = ['蘋果','香蕉','梨子','葡萄','荔枝'];

在這個例子中，我們準備了一個存儲數(shù)字數(shù)據(jù)的數(shù)組和一個存儲字符串數(shù)據(jù)的數(shù)組。

使用reduce()最明顯的方法是計算存儲在這種數(shù)組中的所有值的值。

如果是數(shù)值，則可以計算求和值，如果是字符，則可以將單個字符串連接在一起。

下面我們來看如何使用reduce()?

reduce()可以在目標數(shù)組上執(zhí)行任意函數(shù)。

數(shù)組.reduce(function(累積值, 元素) { })

第一個參數(shù)的“累積值”表示通過按順序處理數(shù)組元素獲得的值。

第二個參數(shù)“元素”表示當前處理的數(shù)組元素。

在該函數(shù)中使用“return”，通過返回任意處理，結(jié)果保留在累積值中，最后可以獲得一個值。

我們來看具體的示例

對數(shù)組的每個元素求和

代碼如下

var numbers = [1,2,3,4,5,6,7,8,9];
var result = numbers.reduce(function(a, b) {
  return a + b;
})
console.log(result);

運行結(jié)果如下

在此示例中，對存儲1到9的數(shù)字的數(shù)組執(zhí)行reduce()。

在函數(shù)中，您可以看到累加的值和每個元素都被簡單地添加。

在第一次處理中變?yōu)椤? + 2”，將和存儲在累積值中，并在下一次處理中執(zhí)行“3 + 3”。

通過這樣做，運行結(jié)果輸出所有值相加為“45”。

最后我們需要說明一點：

reduce()的函數(shù)中使用“break”中斷處理的方法是不可以的，因此作為替代方案，存在利用數(shù)組的索引號的中斷方法，我們下面來簡單看一下。

實際上，reduce()的函數(shù)中最多可以有四個參數(shù)。

配列.reduce(function(累積值, 元素, 索引號, 數(shù)組) { })

第三個參數(shù)“索引號”表示當前處理的數(shù)組的索引號。

第四個參數(shù)“數(shù)組”表示當前正在處理的數(shù)組本身。

利用這個參數(shù)，可以如下來實現(xiàn)中斷過程！

var numbers = [1,2,3,4,5,6,7,8,9];
var result = numbers.reduce(function(a, b, index, arr) {
  if(index >= 3) arr.splice(1);
  return a + b;
});
console.log(result);

運行結(jié)果如下

請注意reduce()函數(shù)中的IF語句！

通過在條件表達式中描述 “index> = 3”，當它成為數(shù)組的第三個索引號時，可以執(zhí)行任意處理。

該過程變?yōu)椤癮rr.splice（1）”，并刪除第三個索引之后的所有數(shù)組元素。

因此，reduce()的處理將結(jié)束，因此您可以執(zhí)行與“break”相同的功能。

感謝各位的閱讀！看完上述內(nèi)容，你們對JavaScript中的reduce()的使用方法大概了解了嗎？希望文章內(nèi)容對大家有所幫助。如果想了解更多相關(guān)文章內(nèi)容，歡迎關(guān)注億速云行業(yè)資訊頻道。